Naar de inhoud

NL Design System gerenderd met Astro

componenten
title title small document title
Accordion Accordion · NL Design System
Action Group Action Group · NL Design System
Alert Alert · NL Design System
Alert Dialog Alert Dialog · NL Design System
Avatar Avatar · NL Design System
Blockquote Blockquote · NL Design System
Breadcrumb Navigation Breadcrumb Navigation · NL Design System
Button Button · NL Design System
Calendar Calendar · NL Design System
Card as Link Card as Link · NL Design System
Case Card Case Card · NL Design System
Checkbox Checkbox · NL Design System
Checkbox Group Checkbox Group · NL Design System
Code Code · NL Design System
Code Block Code Block · NL Design System
Color Sample Color Sample · NL Design System
Contact Timeline Contact Timeline · NL Design System
Data Badge Data Badge · NL Design System
Data Summary Data Summary · NL Design System
Date Input Date Input · NL Design System
Date Input Group Date Input Group · NL Design System
Date Picker Date Picker · NL Design System
Description List Description List · NL Design System
Dialog Dialog · NL Design System
Dot Badge Dot Badge · NL Design System
Drawer Drawer · NL Design System
Fieldset Fieldset · NL Design System
Figure Figure · NL Design System
File File · NL Design System
File Input File Input · NL Design System
Form Field Form Field · NL Design System
Form Field Description Form Field Description · NL Design System
Form Field Error Message Form Field Error Message · NL Design System
Form Field Label Form Field Label · NL Design System
Form Field Label Suffix Form Field Label Suffix · NL Design System
Form Field Status Form Field Status · NL Design System
Form Navigation Form Navigation · NL Design System
Form Summary Form Summary · NL Design System
Grid Grid · NL Design System
Heading Heading · NL Design System
Heading 1 Heading 1 · NL Design System
Heading 2 Heading 2 · NL Design System
Heading 3 Heading 3 · NL Design System
Heading 4 Heading 4 · NL Design System
Heading 5 Heading 5 · NL Design System
Heading 6 Heading 6 · NL Design System
Heading Group Heading Group · NL Design System
Icon Icon · NL Design System
Image Image · NL Design System
Input Group Input Group · NL Design System
Language Navigation Language Navigation · NL Design System
Link Link · NL Design System
Link List Link List · NL Design System
Login Link Login Link · NL Design System
Logo Logo · NL Design System
Mark Mark · NL Design System
Modal Dialog Modal Dialog · NL Design System
Navigation Bar Navigation Bar · NL Design System
Note Note · NL Design System
Notification Banner Notification Banner · NL Design System
Number Badge Number Badge · NL Design System
Number Input Number Input · NL Design System
Ordered List Ordered List · NL Design System
Page Body Page Body · NL Design System
Page Footer Page Footer · NL Design System
Page Header Page Header · NL Design System
Page Layout Page Layout · NL Design System
Page Number Navigation Page Number Navigation · NL Design System
Paragraph Paragraph · NL Design System
Password Input Password Input · NL Design System
Progress Bar Progress Bar · NL Design System
Progress Circle Progress Circle · NL Design System
Progress List Progress List · NL Design System
Pull Quote Pull Quote · NL Design System
Radio Button Radio Button · NL Design System
Radio Group Radio Group · NL Design System
Range Range · NL Design System
Rich Text Content Rich Text Content · NL Design System
Root Root · NL Design System
Select Select · NL Design System
Select Combobox Select Combobox · NL Design System
Separator Separator · NL Design System
Side Navigation Side Navigation · NL Design System
Skip Link Skip Link · NL Design System
Spinner Spinner · NL Design System
Status Badge Status Badge · NL Design System
Strong Strong · NL Design System
Subscript Subscript · NL Design System
Superscript Superscript · NL Design System
Switch Switch · NL Design System
Table Table · NL Design System
Tabs Tabs · NL Design System
Task List Task List · NL Design System
Task Navigation Task Navigation · NL Design System
Text Area Text Area · NL Design System
Text Input Text Input · NL Design System
Toggletip Toggletip · NL Design System
Unordered List Unordered List · NL Design System
Video Video · NL Design System
YouTube Video YouTube Video · NL Design System
Componenten Overzicht Componenten Componenten · NL Design System
baseline
title title small document title
Baseline december 2024 Baseline december 2024 · NL Design System
Baseline april 2025 Baseline april 2025 · NL Design System
Baseline mei 2025 Baseline mei 2025 · NL Design System
Baseline juni 2025 Baseline juni 2025 · NL Design System
Baseline juli 2025 Baseline juli 2025 · NL Design System
Baseline augustus 2025 Baseline augustus 2025 · NL Design System
Baseline september 2025 Baseline september 2025 · NL Design System
Baseline oktober 2025 Baseline oktober 2025 · NL Design System
Baseline november 2025 Baseline november 2025 · NL Design System
Baseline december 2025 Baseline december 2025 · NL Design System
Baseline februari 2026 Baseline februari 2026 · NL Design System
Baseline maart 2026 Baseline maart 2026 · NL Design System
Baseline april 2026 Baseline april 2026 · NL Design System
Baseline mei 2026 Baseline mei 2026 · NL Design System
Baseline Baseline · NL Design System
footer
title title small document title
Code of Conduct Code of Conduct · NL Design System
Code of Conduct Code of Conduct · NL Design System
Colofon Colofon · NL Design System
Privacy policy Privacy policy · NL Design System
Privacyverklaring Privacyverklaring · NL Design System
Toegankelijkheid Toegankelijkheid · NL Design System
Audit toegankelijkheid NLDesignSystem.nl versie 1.0 Audit toegankelijkheid NLDesignSystem.nl versie 1.0 · NL Design System
Audit toegankelijkheid NLDesignSystem.nl versie 2.0 Audit toegankelijkheid NLDesignSystem.nl versie 2.0 · NL Design System
community
title title small document title
Aanmelden als belangenorganisatie Belangenorganisaties Belangenorganisaties · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Community Sprints Community Sprints · NL Design System
MijnServices Community MijnServices Community · NL Design System
Meld je aan voor de MijnServices Community Aanmelden Aanmelden · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Rijkshuisstijl Community Rijkshuisstijl Community · NL Design System
Meld je aan voor de Rijkshuisstijl Community Aanmelden Aanmelden · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Estafettemodeldag Estafettemodeldag · NL Design System
Introduction into European Design Systems 2025 Introduction into European Design Systems 2025 · NL Design System
Thanks for signing up! Thanks for signing up! · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Communitybijeenkomst 18 oktober 2024 Communitybijeenkomst 18 oktober 2024 · NL Design System
Design Open Dag Design Open Dag · NL Design System
Design Open Hour Design Open Hour · NL Design System
Aanmelden Aanmelden · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Design Systems Week Design Systems Week · NL Design System
Design Systems Week 2022 2022 2022 · NL Design System
Videos 2023 2023 · NL Design System
Video's van Design Systems Week 2023 2023 2023 · NL Design System
Videos 2024 2024 · NL Design System
Video's van Design Systems Week 2024 2024 2024 · NL Design System
Videos 2025 2025 · NL Design System
Video's van Design Systems Week 2025 2025 2025 · NL Design System
Tijdschema Tijdschema · NL Design System
Aanmelden voor Design Systems Week Aanmelden Aanmelden · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Design Systems Week Design Systems Week · NL Design System
Propose talk for Design Systems Week Propose talk Propose talk · NL Design System
Thanks for proposing a session Thanks for proposing a session · NL Design System
Sign up for Design Systems Week Sign up Sign up · NL Design System
Thanks for signing up! Thanks for signing up! · NL Design System
Sprekers gezocht voor Design Systems Week Sprekers gezocht Sprekers gezocht · NL Design System
Sessie voorstellen Sessie voorstellen · NL Design System
Developer Open Hour Developer Open Hour · NL Design System
Aanmelden voor de Developer Open Hour Aanmelden Aanmelden · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Heartbeat van NL Design System Heartbeat Heartbeat · NL Design System
Aanmelden voor de Heartbeat Aanmelden Aanmelden · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Video's van de Heartbeat Video's Video's · NL Design System
Zelf iets vertellen Zelf iets vertellen · NL Design System
MijnServices Check-in MijnServices Check-in · NL Design System
Rijkshuisstijl Community Open Hour Rijkshuisstijl Community Open Hour · NL Design System
Expertteam Digitale Toegankelijkheid Expertteam Digitale Toegankelijkheid · NL Design System
Design Tokens valideren Design Tokens valideren · NL Design System
Slack Slack · NL Design System
Design systems bij de overheid Design systems Design systems · NL Design System
Global design systems for governments Global design systems Global design systems · NL Design System
Sluit je aan bij onze community Sluit je aan Sluit je aan · NL Design System
Wie doet mee Wie doet mee · NL Design System
handboek
title title small document title
Figma-bestanden overzicht Figma-bestanden overzicht · NL Design System
GitHub GitHub · NL Design System
Design tokens versiebeheer Design tokens versiebeheer · NL Design System
Figma changelog Figma changelog · NL Design System
Figma hygiëne Figma hygiëne · NL Design System
Figma migratie-stappenplan Figma migratie-stappenplan · NL Design System
Figma stappenplan Figma stappenplan · NL Design System
Figma structuur Figma structuur · NL Design System
Introductie Introductie · NL Design System
Werken met de Figma changelog Werken met de Figma changelog · NL Design System
Werken met NL Design System Werken met NL Design System · NL Design System
Zelf componenten maken Zelf componenten maken · NL Design System
Zelf componenten uitbreiden Zelf componenten uitbreiden · NL Design System
Zelf een thema maken Zelf een thema maken · NL Design System
Aan de slag met NL Design System Aan de slag Aan de slag · NL Design System
API conventie API conventie · NL Design System
Migreer van een CDN naar pnpm Migreer van een CDN naar pnpm · NL Design System
CDN gebruiken CDN gebruiken · NL Design System
Nieuwe versies uitbrengen met Changesets Changesets Changesets · NL Design System
Conventies Conventies · NL Design System
Aanpak voor versionering Versionering conventie Versionering conventie · NL Design System
CSS conventie CSS conventie · NL Design System
Deprecation Deprecation · NL Design System
Design Token conventie Design Token conventie · NL Design System
Design tokens Design tokens · NL Design System
GitHub Actions GitHub Actions · NL Design System
GitHub teams en code owners GitHub teams en code owners · NL Design System
Infrastructuur Infrastructuur · NL Design System
Introductie Introductie · NL Design System
Werken met Node.js Werken met Node.js · NL Design System
Publiceren van npm packages Publiceren van npm packages · NL Design System
Werken met pnpm Werken met pnpm · NL Design System
Prototypes met NL Design System Prototypes Prototypes · NL Design System
Prototypes zonder front-end framework Prototypes zonder front-end framework · NL Design System
Semantic Versioning Semantic Versioning · NL Design System
Namen van states Namen van states · NL Design System
Design tokens vastleggen Design tokens vastleggen · NL Design System
Overzicht Candidate Candidate · NL Design System
3. Ontwikkelfase 3. Ontwikkelfase · NL Design System
5. Publicatiefase 5. Publicatiefase · NL Design System
1. Selectiefase 1. Selectiefase · NL Design System
4. Testfase 4. Testfase · NL Design System
2. Voorbereidings 2. Voorbereidings · NL Design System
Community stappenplan Community Community · NL Design System
Community stappenplan voor het kernteam Kernteam Kernteam · NL Design System
Community stappenplan voor organisaties Organisaties Organisaties · NL Design System
Definition of Done voor componenten Definition of Done Definition of Done · NL Design System
Overzicht Hall of Fame Hall of Fame · NL Design System
1. Feedbackfase 1. Feedbackfase · NL Design System
4. Ontwikkelfase 4. Ontwikkelfase · NL Design System
6. Publicatiefase 6. Publicatiefase · NL Design System
2. Selectiefase 2. Selectiefase · NL Design System
5. Testfase 5. Testfase · NL Design System
3. Voorbereidingsfase 3. Voorbereidingsfase · NL Design System
Help Wanted stappenplan Help Wanted Help Wanted · NL Design System
Basis-tokens Basis-tokens · NL Design System
Design tokens Design tokens · NL Design System
Thema's Thema's · NL Design System
Start-thema Start-thema · NL Design System
Voorbeeld-thema Voorbeeld-thema · NL Design System
Linting en code formatting Linting en code formatting · NL Design System
Security audit voor npm Security audit voor npm · NL Design System
Vercel Vercel · NL Design System
Componenten vinden Componenten vinden · NL Design System
Estafettemodel Estafettemodel · NL Design System
Introductie Introductie · NL Design System
CI/CD CI/CD · NL Design System
Voor leveranciers Voor leveranciers · NL Design System
Voor managers Voor managers · NL Design System
Naamgeving Naamgeving · NL Design System
Meedoen als organisatie Meedoen Meedoen · NL Design System
Tips voor NL Design System in aanbestedingen Aanbestedingen Aanbestedingen · NL Design System
project
title title small document title
Code reviews Code reviews · NL Design System
Bedankt voor je aanmelding Bedankt voor je aanmelding · NL Design System
Op de hoogte blijven Op de hoogte blijven · NL Design System
Veelgestelde vragen Veelgestelde vragen · NL Design System
Project Project · NL Design System
Kernteam Kernteam · NL Design System
Klachten Klachten · NL Design System
Agile sprint Agile sprint · NL Design System
Backup Backup · NL Design System
Broncodekwaliteit Broncodekwaliteit · NL Design System
Continuous Delivery Continuous Delivery · NL Design System
Continuous Deployment Continuous Deployment · NL Design System
Continuous Integration Continuous Integration · NL Design System
Definition of Done Definition of Done · NL Design System
Definition of Ready Definition of Ready · NL Design System
Internationalisatie en localisatie Internationalisatie en localisatie · NL Design System
Kwaliteitsaanpak Kwaliteitsaanpak · NL Design System
Open Source Open Source · NL Design System
Product Backlog Product Backlog · NL Design System
Productieomgeving Productieomgeving · NL Design System
Release notes Release notes · NL Design System
Sprint review Sprint review · NL Design System
Software supply chain Software supply chain · NL Design System
Testomgeving Testomgeving · NL Design System
Toegankelijkheid Toegankelijkheid · NL Design System
Veilig werken Veilig werken · NL Design System
Veilige werkomgeving Veilige werkomgeving · NL Design System
Versiebeheer Versiebeheer · NL Design System
Over NL Design System Over NL Design System Over NL Design System · NL Design System
Afbeeldingen Afbeeldingen · NL Design System
Beslissingen voor schrijfwijze Beslissingen voor schrijfwijze · NL Design System
Doelen Doelen · NL Design System
Doelgroepen Doelgroepen · NL Design System
Engels Engels · NL Design System
Schrijfwijzer Schrijfwijzer · NL Design System
Nederlands Nederlands · NL Design System
Opbouw van een pagina Opbouw van een pagina · NL Design System
Reviews Reviews · NL Design System
Video Video · NL Design System
Aanpak voor WCAG-pagina's Aanpak voor WCAG-pagina's · NL Design System
richtlijnen
title title small document title
Richtlijnen Richtlijnen · NL Design System
Introductie richtlijnen voor content Content Content · NL Design System
Introductie richtlijnen voor afbeeldingen Afbeeldingen Afbeeldingen · NL Design System
Algemene richtlijnen Algemene richtlijnen · NL Design System
Waar moet een alternatieve tekst staan? Waar moet een alternatieve tekst staan? · NL Design System
Decoratieve afbeeldingen Decoratieve afbeeldingen · NL Design System
Functionele afbeeldingen Functionele afbeeldingen · NL Design System
Grafieken Grafieken · NL Design System
Informatieve afbeeldingen Informatieve afbeeldingen · NL Design System
Tekst in een afbeelding Tekst in een afbeelding · NL Design System
Citaten Citaten · NL Design System
Kantoorbestanden Kantoorbestanden · NL Design System
Introductie richtlijnen voor tekstopmaak Tekstopmaak Tekstopmaak · NL Design System
Kleurgebruik in tekst Kleurgebruik in tekst · NL Design System
Koppen Koppen · NL Design System
Toegankelijke linkteksten Toegankelijke linkteksten · NL Design System
Opsommingen Opsommingen · NL Design System
De juiste taal instellen De juiste taal instellen · NL Design System
Tabellen Tabellen · NL Design System
Tekst benadrukken Tekst benadrukken · NL Design System
Introductie richtlijnen voor video Video Video · NL Design System
Audiodescriptie Audiodescriptie · NL Design System
Beschrijving voor video Video beschrijving Video beschrijving · NL Design System
Flitsen in video Flitsen Flitsen · NL Design System
Gebarentaal Gebarentaal · NL Design System
Ondertiteling Ondertiteling · NL Design System
Transcript Transcript · NL Design System
Introductie richtlijnen voor formulieren Formulieren Formulieren · NL Design System
Bevestigingspagina van een formulier Bevestigingspagina Bevestigingspagina · NL Design System
Zorg dat de gebruiker contact op kan nemen bij vragen Contact opnemen Contact opnemen · NL Design System
Vermeld dat het formulier succesvol is verzonden Duidelijke succesmelding Duidelijke succesmelding · NL Design System
Maak de succesmelding toegankelijk voor alle gebruikers Toegankelijke succesmelding Toegankelijke succesmelding · NL Design System
Vertel wat de vervolgacties zijn Benoem vervolgstappen Benoem vervolgstappen · NL Design System
Buttons in een formulier Buttons Buttons · NL Design System
Afbeeldingen als buttons Afbeelding als button Afbeelding als button · NL Design System
Disabled submitbuttons Disabled submitbuttons · NL Design System
Duidelijk buttontekst die beschrijft wat de button doet Duidelijke buttontekst Duidelijke buttontekst · NL Design System
Verstuur een formulier niet automatisch na het wijzigen of invullen van een formulierveld Verstuur niet automatisch Verstuur niet automatisch · NL Design System
Plaatsing van een button binnen een formulier Plaatsing button Plaatsing button · NL Design System
De toegankelijke naam van een button Toegankelijke naam Toegankelijke naam · NL Design System
Toetsenbordbediening van een button Toetsenbordbediening Toetsenbordbediening · NL Design System
Descriptions in een formulier Descriptions Descriptions · NL Design System
Houd het aanklikbare gedeelte groot genoeg Grootte aanklikbaar gedeelte Grootte aanklikbaar gedeelte · NL Design System
Gebruik alleen tekst in descriptions Inhoud description Inhoud description · NL Design System
Koppel een description aan het formulierveld Koppel description Koppel description · NL Design System
Houd de description kort en to-the-point Lengte description Lengte description · NL Design System
Meerdere descriptions koppelen Meerdere descriptions Meerdere descriptions · NL Design System
Plaats descriptions tussen label en formulierveld Plaatsing description Plaatsing description · NL Design System
Plaats descriptions bij een fieldset tussen legend en eerste item Description bij fieldsets Description bij fieldsets · NL Design System
Fieldsets in een formulier Fieldsets Fieldsets · NL Design System
Descriptions in een fieldset Descriptions in een fieldset · NL Design System
Legends Legends · NL Design System
Foutmeldingen in een formulier Foutmeldingen Foutmeldingen · NL Design System
Schrijf een foutmelding uit in tekst Fouten beschrijven Fouten beschrijven · NL Design System
Controleer op het juiste moment op fouten Fouten controleren Fouten controleren · NL Design System
Schrijf een duidelijke foutmelding Duidelijke foutmeldingen Duidelijke foutmeldingen · NL Design System
Gebruik geen HTML-formuliervalidatie HTML-formuliervalidatie HTML-formuliervalidatie · NL Design System
Zet de foutmeldingen bij de betreffende formuliervelden Plaatsing foutmelding Plaatsing foutmelding · NL Design System
Zet een samenvatting van de foutmeldingen boven het formulier Samenvatting fouten Samenvatting fouten · NL Design System
Geef feedback aan screenreadergebruikers Screenreaderfeedback Screenreaderfeedback · NL Design System
Labels in een formulier Labels Labels · NL Design System
Zet alleen tekst in het label Label bevat alleen tekst Label bevat alleen tekst · NL Design System
Zorg ervoor dat het label altijd zichtbaar is Label zichtbaar Label zichtbaar · NL Design System
Gebruik duidelijke labelteksten Duidelijke tekst label Duidelijke tekst label · NL Design System
Zet het label boven het formulierveld Plaatsing label Plaatsing label · NL Design System
Geef een formulierveld een toegankelijke naam met een label Toegankelijke naam label Toegankelijke naam label · NL Design System
De zichtbare naam moet overeenkomen met de toegankelijke naam Zichtbare naam label Zichtbare naam label · NL Design System
Links in een formulier Links Links · NL Design System
Zet geen link in een label Geen link in label Geen link in label · NL Design System
Geef aan als een link in een nieuwe tab opent Link in nieuwe tab Link in nieuwe tab · NL Design System
Plaats de link boven het gerelateerde formulierveld Plaatsing link Plaatsing link · NL Design System
Meerdere stappen in een formulier Meerdere stappen Meerdere stappen · NL Design System
Zorg voor een consistente navigatie en benaming van links en buttons Consistente navigatie Consistente navigatie · NL Design System
Plaats de informatie over waar de gebruiker is in de stappen boven het formulier Plaatsing voortgang stappen Plaatsing voortgang stappen · NL Design System
Bied als laatste stap een opsomming aan van alle ingevoerde gegevens Samenvatting in laatste stap Samenvatting in laatste stap · NL Design System
Geef duidelijk aan wanneer het formulier verzonden gaat worden Duidelijk aangeven verzenden Duidelijk aangeven verzenden · NL Design System
Geef aan hoeveel stappen er zijn en in welke stap de gebruiker zich bevindt Voortgang stappen tonen Voortgang stappen tonen · NL Design System
Placeholders in een formulier Placeholders Placeholders · NL Design System
Zorg voor een goed kleurcontrast van de placeholdertekst Placeholder kleurcontrast Placeholder kleurcontrast · NL Design System
Een placeholder is geen vervanger van een label Placeholder is geen label Placeholder is geen label · NL Design System
Voorkom verwarring bij de gebruiker Placeholder kan verwarren Placeholder kan verwarren · NL Design System
Placeholders en de zoekfunctie Placeholder bij zoekfunctie Placeholder bij zoekfunctie · NL Design System
Status in een formulier Status Status · NL Design System
Geef gebruikers voldoende tijd Geef gebruikers voldoende tijd · NL Design System
Informeer gebruikers van screenreaders over het statusbericht Informeer screenreaders Informeer screenreaders · NL Design System
Informeer ingezoomde gebruikers Informeer ingezoomde gebruikers · NL Design System
Toetsenbordnavigatie in een formulier Toetsenbord Toetsenbord · NL Design System
Gebruik geen positieve tabindex Geen positieve tabindex Geen positieve tabindex · NL Design System
Zorg dat het formulier werkt met een toetsenbord Toetsenbordnavigatie Toetsenbordnavigatie · NL Design System
Visueel ontwerp van een formulier Visueel ontwerp Visueel ontwerp · NL Design System
Maak toetsenbordfocus goed zichtbaar Focus goed zichtbaar Focus goed zichtbaar · NL Design System
Geef fouten weer met meer dan alleen kleur Fouten niet kleurafhankelijk Fouten niet kleurafhankelijk · NL Design System
Gebruik geen afbeelding voor buttons maar stijl tekst met CSS Geen afbeelding voor buttons Geen afbeelding voor buttons · NL Design System
Maak aanklikbare formuliervelden groot genoeg Invoerveld goed aanklikbaar Invoerveld goed aanklikbaar · NL Design System
Geef duidelijk aan waar een invoerveld is Invoerveld goed zichtbaar Invoerveld goed zichtbaar · NL Design System
Zorg voor een logische volgorde van de informatie Logische volgorde Logische volgorde · NL Design System
Geef placeholders voldoende kleurcontrast Placeholder goed zichtbaar Placeholder goed zichtbaar · NL Design System
Geef tekst voldoende kleurcontrast Tekst goed zichtbaar Tekst goed zichtbaar · NL Design System
Voorkom fouten in een formulier Voorkom fouten Voorkom fouten · NL Design System
Autocomplete in een formulier Autocomplete Autocomplete · NL Design System
Vul bekende informatie in waar mogelijk Automatisch invullen Automatisch invullen · NL Design System
Maak het mogelijk een inzending te controleren, te wijzigen of ongedaan te maken Controleren en aanpassen Controleren en aanpassen · NL Design System
Maak het mogelijk een inzending te controleren, te wijzigen of ongedaan te maken Vermijd invoerpatronen Vermijd invoerpatronen · NL Design System
Geef geldige waardes aan voor een invoerveld Geef geldige waardes aan Geef geldige waardes aan · NL Design System
Keur niet te snel af Keur niet te snel af · NL Design System
Vermeld duidelijk of een veld wel of niet verplicht is Optioneel of verplicht Optioneel of verplicht · NL Design System
Sta knippen en plakken van een wachtwoord toe Wachtwoord plakken Wachtwoord plakken · NL Design System
Uit te vragen informatie in een formulier Uit te vragen informatie Uit te vragen informatie · NL Design System
Check of informatie ècht nodig is Waarom is informatie nodig Waarom is informatie nodig · NL Design System
Geef invoervelden geen minimum/maximum tekstlengte Geen vaste tekstlengte Geen vaste tekstlengte · NL Design System
Leg uit waarom informatie nodig is Waarom stel je de vraag Waarom stel je de vraag · NL Design System
Biedt verschillende manieren om contact op te nemen Bied contactmogelijkheden Bied contactmogelijkheden · NL Design System
Vraag niet meerdere keren dezelfde informatie uit Stel een vraag één keer Stel een vraag één keer · NL Design System
Wanneer gebruik je welk formulierelement? Wanneer welk element Wanneer welk element · NL Design System
Zorg dat iedereen een formulierelement kan bedienen of geef een alternatief Iedereen kan velden invullen Iedereen kan velden invullen · NL Design System
Kies voor het meest gebruiksvriendelijke formulierelement Kies gebruiksvriendelijkheid Kies gebruiksvriendelijkheid · NL Design System
Introductie richtlijnen voor stijl Stijl Stijl · NL Design System
Introductie richtlijnen voor iconen Iconen Iconen · NL Design System
Maak functionele iconen simpel van vorm Maak functionele iconen simpel van vorm · NL Design System
Gebruik SVG voor iconen en geen font Gebruik SVG voor iconen en geen font · NL Design System
Stem de grootte van je iconen af op je lettergrootte Stem de grootte van je iconen af op je lettergrootte · NL Design System
Zorg ook bij iconen voor voldoende contrast Zorg voor voldoende contrast Zorg voor voldoende contrast · NL Design System
Laat de lijndikte meeschalen Laat de lijndikte meeschalen · NL Design System
Positioneer iconen binnen een vierkant grid Positioneer iconen binnen een vierkant grid · NL Design System
Respecteer conventies Respecteer conventies · NL Design System
Toptaak iconen kunnen gedetailleerd zijn Toptaak iconen kunnen gedetailleerd zijn · NL Design System
Introductie richtlijnen voor kleuren Kleuren Kleuren · NL Design System
Zorg voor voldoende kleurcontrast voor niet-tekstuele content Kleurcontrast voor niet-tekstuele content Kleurcontrast voor niet-tekstuele content · NL Design System
Zorg voor voldoende kleurcontrast voor tekst tegen de achtergrond Kleurcontrast voor tekst Kleurcontrast voor tekst · NL Design System
Gebruik kleur met een doel Gebruik kleur met een doel · NL Design System
Vertrouw niet alleen op kleur Vertrouw niet alleen op kleur · NL Design System
Let op voorkeursinstellingen voor kleur Voorkeursinstellingen voor kleur Voorkeursinstellingen voor kleur · NL Design System
Let op verschillen in waarneming van kleur Verschillen in waarneming van kleur Verschillen in waarneming van kleur · NL Design System
Introductie richtlijnen voor ruimte Ruimte Ruimte · NL Design System
Werk en denk vanuit het box model Box model Box model · NL Design System
Gebruik ruimte om hiërarchie te creëren tussen elementen Hiërarchie tussen elementen Hiërarchie tussen elementen · NL Design System
Reserveer ruimte tussen interactieve elementen Interactieve elementen Interactieve elementen · NL Design System
Gebruik ruimte om relaties te creëren tussen elementen Relaties tussen elementen Relaties tussen elementen · NL Design System
Stem het gebruik van ruimte af op de functie en inhoud Ruim of compact Ruim of compact · NL Design System
Maak gebruik van de spacing concepten Spacing concepten Spacing concepten · NL Design System
Maak gebruik van een spacing scale Spacing scale Spacing scale · NL Design System
Introductie richtlijnen voor typografie Typografie Typografie · NL Design System
Zorg ervoor dat letters groot genoeg zijn Letters groot genoeg Letters groot genoeg · NL Design System
Kies een goed lettertype Goed lettertype Goed lettertype · NL Design System
Zorg voor een comfortabele regelafstand Comfortabele regelafstand Comfortabele regelafstand · NL Design System
Zorg voor een comfortabele regellengte Comfortabele regellengte Comfortabele regellengte · NL Design System
Uitlijning Uitlijning · NL Design System
Let op voorkeursinstellingen voor typografie Let op voorkeursinstellingen voor typografie · NL Design System
voorbeelden
title title small document title
Voorbeelden Voorbeelden · NL Design System
Gebruikersonderzoek Gebruikersonderzoek · NL Design System
Introductie patronen en templates Introductie patronen en templates · NL Design System
Formulieren Formulieren · NL Design System
Mijn omgevingen Mijn omgevingen · NL Design System
woordenlijst
title title small document title
Woordenlijst Woordenlijst · NL Design System
CHANGELOG.md
title title small document title
Changelog Changelog · NL Design System
open-source
title title small document title
Creative Commons 0 Universal licentie Creative Commons 0 Creative Commons 0 · NL Design System
EUPL 1.2 licentie EUPL 1.2 EUPL 1.2 · NL Design System
private
title title small document title
Doelen van NL Design System componenten Doelen Doelen · NL Design System
wcag
title title small document title
Introductie WCAG pagina's WCAG WCAG · NL Design System
WCAG-succescriterium 1.1.1 Niet-tekstuele content 1.1.1 Niet-tekstuele content 1.1.1 Niet-tekstuele content · NL Design System
WCAG-succescriterium 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) 1.2.1 Louter-geluid en louter-videobeeld (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) 1.2.2 Ondertitels voor doven en slechthorenden (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) 1.2.3 Audiodescriptie of media-alternatief (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.4 Ondertitels voor doven en slechthorenden (live) 1.2.4 Ondertitels voor doven en slechthorenden (live) 1.2.4 Ondertitels voor doven en slechthorenden (live) · NL Design System
WCAG-succescriterium 1.2.5 Audiodescriptie (vooraf opgenomen) 1.2.5 Audiodescriptie (vooraf opgenomen) 1.2.5 Audiodescriptie (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.6 Gebarentaal (vooraf opgenomen) 1.2.6 Gebarentaal (vooraf opgenomen) 1.2.6 Gebarentaal (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.7 Verlengde audiodescriptie (vooraf opgenomen) 1.2.7 Verlengde audiodescriptie (vooraf opgenomen) 1.2.7 Verlengde audiodescriptie (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.8 Media-alternatief (vooraf opgenomen) 1.2.8 Media-alternatief (vooraf opgenomen) 1.2.8 Media-alternatief (vooraf opgenomen) · NL Design System
WCAG-succescriterium 1.2.9 Louter-geluid (live) 1.2.9 Louter-geluid (live) 1.2.9 Louter-geluid (live) · NL Design System
WCAG-succescriterium 1.3.1 Info en relaties 1.3.1 Info en relaties 1.3.1 Info en relaties · NL Design System
WCAG-succescriterium 1.3.2 Betekenisvolle volgorde 1.3.2 Betekenisvolle volgorde 1.3.2 Betekenisvolle volgorde · NL Design System
WCAG-succescriterium 1.3.3 Zintuiglijke eigenschappen 1.3.3 Zintuiglijke eigenschappen 1.3.3 Zintuiglijke eigenschappen · NL Design System
WCAG-succescriterium 1.3.4 Weergavestand 1.3.4 Weergavestand 1.3.4 Weergavestand · NL Design System
WCAG-succescriterium 1.3.5 Identificeer het doel van de input 1.3.5 Identificeer het doel van de input 1.3.5 Identificeer het doel van de input · NL Design System
WCAG-succescriterium 1.3.6 Identificeer het doel 1.3.6 Identificeer het doel 1.3.6 Identificeer het doel · NL Design System
WCAG-succescriterium 1.4.1 Gebruik van kleur 1.4.1 Gebruik van kleur 1.4.1 Gebruik van kleur · NL Design System
WCAG-succescriterium 1.4.10 Reflow 1.4.10 Reflow 1.4.10 Reflow · NL Design System
WCAG-succescriterium 1.4.11 Contrast van niet-tekstuele content 1.4.11 Contrast van niet-tekstuele content 1.4.11 Contrast van niet-tekstuele content · NL Design System
WCAG-succescriterium 1.4.12 Tekstafstand 1.4.12 Tekstafstand 1.4.12 Tekstafstand · NL Design System
WCAG-succescriterium 1.4.13 Content bij hover of focus 1.4.13 Content bij hover of focus 1.4.13 Content bij hover of focus · NL Design System
WCAG-succescriterium 1.4.2 Geluidsbediening 1.4.2 Geluidsbediening 1.4.2 Geluidsbediening · NL Design System
WCAG-succescriterium 1.4.3 Contrast (minimum) 1.4.3 Contrast (minimum) 1.4.3 Contrast (minimum) · NL Design System
WCAG-succescriterium 1.4.4 Herschalen van tekst 1.4.4 Herschalen van tekst 1.4.4 Herschalen van tekst · NL Design System
WCAG-succescriterium 1.4.5 Afbeeldingen van tekst 1.4.5 Afbeeldingen van tekst 1.4.5 Afbeeldingen van tekst · NL Design System
WCAG-succescriterium 1.4.6 Contrast (versterkt) 1.4.6 Contrast (versterkt) 1.4.6 Contrast (versterkt) · NL Design System
WCAG-succescriterium 1.4.7 Weinig of geen achtergrondgeluid 1.4.7 Weinig of geen achtergrondgeluid 1.4.7 Weinig of geen achtergrondgeluid · NL Design System
WCAG-succescriterium 1.4.8 Visuele presentatie 1.4.8 Visuele presentatie 1.4.8 Visuele presentatie · NL Design System
WCAG-succescriterium 1.4.9 Afbeeldingen van tekst (geen uitzondering) 1.4.9 Afbeeldingen van tekst (geen uitzondering) 1.4.9 Afbeeldingen van tekst (geen uitzondering) · NL Design System
WCAG-succescriterium 2.1.1 Toetsenbord 2.1.1 Toetsenbord 2.1.1 Toetsenbord · NL Design System
WCAG-succescriterium 2.1.2 Geen toetsenbordval 2.1.2 Geen toetsenbordval 2.1.2 Geen toetsenbordval · NL Design System
WCAG-succescriterium 2.1.3 Toetsenbord (geen uitzondering) 2.1.3 Toetsenbord (geen uitzondering) 2.1.3 Toetsenbord (geen uitzondering) · NL Design System
WCAG-succescriterium 2.1.4 Enkel teken sneltoetsen 2.1.4 Enkel teken sneltoetsen 2.1.4 Enkel teken sneltoetsen · NL Design System
WCAG-succescriterium 2.2.1 Timing aanpasbaar 2.2.1 Timing aanpasbaar 2.2.1 Timing aanpasbaar · NL Design System
WCAG-succescriterium 2.2.2 Pauzeren, stoppen, verbergen 2.2.2 Pauzeren, stoppen, verbergen 2.2.2 Pauzeren, stoppen, verbergen · NL Design System
WCAG-succescriterium 2.2.3 Geen timing 2.2.3 Geen timing 2.2.3 Geen timing · NL Design System
WCAG-succescriterium 2.2.4 Onderbrekingen 2.2.4 Onderbrekingen 2.2.4 Onderbrekingen · NL Design System
WCAG-succescriterium 2.2.5 Herauthentisering 2.2.5 Herauthentisering 2.2.5 Herauthentisering · NL Design System
WCAG-succescriterium 2.2.6 Time-outs 2.2.6 Time-outs 2.2.6 Time-outs · NL Design System
WCAG-succescriterium 2.3.1 Drie flitsen of beneden drempelwaarde 2.3.1 Drie flitsen of beneden drempelwaarde 2.3.1 Drie flitsen of beneden drempelwaarde · NL Design System
WCAG-succescriterium 2.3.2 Drie flitsen 2.3.2 Drie flitsen 2.3.2 Drie flitsen · NL Design System
WCAG-succescriterium 2.3.3 Animatie uit interacties 2.3.3 Animatie uit interacties 2.3.3 Animatie uit interacties · NL Design System
WCAG-succescriterium 2.4.1 Blokken omzeilen 2.4.1 Blokken omzeilen 2.4.1 Blokken omzeilen · NL Design System
WCAG-succescriterium 2.4.10 Paragraafkoppen 2.4.10 Paragraafkoppen 2.4.10 Paragraafkoppen · NL Design System
WCAG-succescriterium 2.4.11 Focus niet bedekt (minimum) 2.4.11 Focus niet bedekt (minimum) 2.4.11 Focus niet bedekt (minimum) · NL Design System
WCAG-succescriterium 2.4.12 Focus niet bedekt (uitgebreid) 2.4.12 Focus niet bedekt (uitgebreid) 2.4.12 Focus niet bedekt (uitgebreid) · NL Design System
WCAG-succescriterium 2.4.13 Focusweergave 2.4.13 Focusweergave 2.4.13 Focusweergave · NL Design System
WCAG-succescriterium 2.4.2 Paginatitel 2.4.2 Paginatitel 2.4.2 Paginatitel · NL Design System
WCAG-succescriterium 2.4.3 Focus volgorde 2.4.3 Focus volgorde 2.4.3 Focus volgorde · NL Design System
WCAG-succescriterium 2.4.4 Linkdoel (in context) 2.4.4 Linkdoel (in context) 2.4.4 Linkdoel (in context) · NL Design System
WCAG-succescriterium 2.4.5 Meerdere manieren 2.4.5 Meerdere manieren 2.4.5 Meerdere manieren · NL Design System
WCAG-succescriterium 2.4.6 Koppen en labels 2.4.6 Koppen en labels 2.4.6 Koppen en labels · NL Design System
WCAG-succescriterium 2.4.7 Focus zichtbaar 2.4.7 Focus zichtbaar 2.4.7 Focus zichtbaar · NL Design System
WCAG-succescriterium 2.4.8 Locatie 2.4.8 Locatie 2.4.8 Locatie · NL Design System
WCAG-succescriterium 2.4.9 Linkdoel (alleen link) 2.4.9 Linkdoel (alleen link) 2.4.9 Linkdoel (alleen link) · NL Design System
WCAG-succescriterium 2.5.1 Aanwijzergebaren 2.5.1 Aanwijzergebaren 2.5.1 Aanwijzergebaren · NL Design System
WCAG-succescriterium 2.5.2 Aanwijzerannulering 2.5.2 Aanwijzerannulering 2.5.2 Aanwijzerannulering · NL Design System
WCAG-succescriterium 2.5.3 Label in Naam 2.5.3 Label in Naam 2.5.3 Label in Naam · NL Design System
WCAG-succescriterium 2.5.4 Bewegingsactivering 2.5.4 Bewegingsactivering 2.5.4 Bewegingsactivering · NL Design System
WCAG-succescriterium 2.5.5 Grootte van het aanwijsgebied (uitgebreid) 2.5.5 Grootte van het aanwijsgebied (uitgebreid) 2.5.5 Grootte van het aanwijsgebied (uitgebreid) · NL Design System
WCAG-succescriterium 2.5.6 Input gelijktijdige invoermechanismen 2.5.6 Input gelijktijdige invoermechanismen 2.5.6 Input gelijktijdige invoermechanismen · NL Design System
WCAG-succescriterium 2.5.7 Sleepbewegingen 2.5.7 Sleepbewegingen 2.5.7 Sleepbewegingen · NL Design System
WCAG-succescriterium 2.5.8 Grootte van het aanwijsgebied (minimum) 2.5.8 Grootte van het aanwijsgebied (minimum) 2.5.8 Grootte van het aanwijsgebied (minimum) · NL Design System
WCAG-succescriterium 3.1.1 Taal van de pagina 3.1.1 Taal van de pagina 3.1.1 Taal van de pagina · NL Design System
WCAG-succescriterium 3.1.2 Taal van onderdelen 3.1.2 Taal van onderdelen 3.1.2 Taal van onderdelen · NL Design System
WCAG-succescriterium 3.1.3 Ongebruikelijke woorden 3.1.3 Ongebruikelijke woorden 3.1.3 Ongebruikelijke woorden · NL Design System
WCAG-succescriterium 3.1.4 Afkortingen 3.1.4 Afkortingen 3.1.4 Afkortingen · NL Design System
WCAG-succescriterium 3.1.5 Leesniveau 3.1.5 Leesniveau 3.1.5 Leesniveau · NL Design System
WCAG-succescriterium 3.1.6 Uitspraak 3.1.6 Uitspraak 3.1.6 Uitspraak · NL Design System
WCAG-succescriterium 3.2.1 Bij focus 3.2.1 Bij focus 3.2.1 Bij focus · NL Design System
WCAG-succescriterium 3.2.2 Bij input 3.2.2 Bij input 3.2.2 Bij input · NL Design System
WCAG-succescriterium 3.2.3 Consistente navigatie 3.2.3 Consistente navigatie 3.2.3 Consistente navigatie · NL Design System
WCAG-succescriterium 3.2.4 Consistente identificatie 3.2.4 Consistente identificatie 3.2.4 Consistente identificatie · NL Design System
WCAG-succescriterium 3.2.5 Verandering op verzoek 3.2.5 Verandering op verzoek 3.2.5 Verandering op verzoek · NL Design System
WCAG-succescriterium 3.2.6 Consistente hulp 3.2.6 Consistente hulp 3.2.6 Consistente hulp · NL Design System
WCAG-succescriterium 3.3.1 Foutidentificatie 3.3.1 Foutidentificatie 3.3.1 Foutidentificatie · NL Design System
WCAG-succescriterium 3.3.2 Labels of instructies 3.3.2 Labels of instructies 3.3.2 Labels of instructies · NL Design System
WCAG-succescriterium 3.3.3 Foutsuggestie 3.3.3 Foutsuggestie 3.3.3 Foutsuggestie · NL Design System
WCAG-succescriterium 3.3.4 Foutpreventie (wettelijk, financieel, gegevens) 3.3.4 Foutpreventie (wettelijk, financieel, gegevens) 3.3.4 Foutpreventie (wettelijk, financieel, gegevens) · NL Design System
WCAG-succescriterium 3.3.5 Hulp 3.3.5 Hulp 3.3.5 Hulp · NL Design System
WCAG-succescriterium 3.3.6 Foutpreventie (alle) 3.3.6 Foutpreventie (alle) 3.3.6 Foutpreventie (alle) · NL Design System
WCAG-succescriterium 3.3.7 Overbodige invoer 3.3.7 Overbodige invoer 3.3.7 Overbodige invoer · NL Design System
WCAG-succescriterium 3.3.8 Toegankelijke authenticatie (minimum) 3.3.8 Toegankelijke authenticatie (minimum) 3.3.8 Toegankelijke authenticatie (minimum) · NL Design System
WCAG-succescriterium 3.3.9 Toegankelijke authenticatie (uitgebreid) 3.3.9 Toegankelijke authenticatie (uitgebreid) 3.3.9 Toegankelijke authenticatie (uitgebreid) · NL Design System
WCAG-succescriterium 4.1.1 Parsen 4.1.1 Parsen 4.1.1 Parsen · NL Design System
WCAG-succescriterium 4.1.2 Naam, rol, waarde 4.1.2 Naam, rol, waarde 4.1.2 Naam, rol, waarde · NL Design System
WCAG-succescriterium 4.1.3 Statusberichten 4.1.3 Statusberichten 4.1.3 Statusberichten · NL Design System