Kleurselector

Benodigde stappen:

  1. Voeg de benodigde bestanden toe aan het project. Voor een overzicht van de benodigde en optionele bestanden zie: Bijbehorende bestanden.
  2. voeg type="color" toe aan het invoerveld.
  3. Voeg basiskleurwaarde met een hexidecimalekleurcode aan binnen: value. Voorbeeld: value="#ffffff". De ingevoerde kleur is de kleur waarin het selectievak getoont wordt binnen het formulier voordat de gebruiker een andere keuze maakt.

Voorbeelden

Visueel voorbeeld:

direct

HTML-voorbeeld:

section

<form action="" method="post">
<label for="color-input-1">Selecteer de gewenste kleur</label>
<input id="color-input-1" name="color-input-1" type="color" value="#ffffff">

<button type="submit">Verzend</button>
</form>

Bijbehorende bestanden

Voor meer informatie over importeren en instellen van componenten. Zie: Componenten gebruiken en styling toevoegen

Importeer component via npm

CSS-voorbeeld:

@use "@minvws/manon/form-base";
@use "@minvws/manon/form-input-color";

Instelbare variabelen

Dit element heeft zelf geen instelbare variabelen.

Bijbehorende elementen: