Moodboard

Experimenteer met kleurthema's in een afgeschermd voorbeeld. De rest van de site houdt het vaste design.

Kleurvariaties

Kies een thema: het voorbeeld hieronder gebruikt alleen kleuren binnen dit moodboard. De echte sitenavigatie en andere pagina's blijven het vaste Apolier-design houden.

Optioneel: open de homepage-inhoud in dit thema in een aparte route - ook daar blijft de site-header het standaard uiterlijk (Midnight Blush in CSS).

Volledige homepage-inhoud in dit thema

Live voorbeeld (alleen dit blok)

Simulatie van header + hero. Variabelen gelden alleen binnen het kader - niet voor de echte menubalk van de site.

Aplier

Vind jouw partner voor photobooths.

Vergelijk aanbieders en regel jouw photobooth in een paar stappen.

Bekijk photobooths

Thema: Midnight Blush

Palette canvas

Referentie-export: dezelfde zes tinten in CSV, hex-lijst, JSON en XML - klaar om te kopiëren.

Crimson Violet#601441

Prussian Blue#111E3B

Space Indigo#192646

Petal Frost#F8CEDA

Pink Mist#EA94AD

Twilight Indigo#2A3458

CSV

601441,111E3B,192646,F8CEDA,EA94AD,2A3458

With #

#601441, #111E3B, #192646, #F8CEDA, #EA94AD, #2A3458

Array

["601441","111E3B","192646","F8CEDA","EA94AD","2A3458"]

Object

{"Crimson Violet":"601441","Prussian Blue":"111E3B","Space Indigo":"192646","Petal Frost":"F8CEDA","Pink Mist":"EA94AD","Twilight Indigo":"2A3458"}

Extended Array

[{"name":"Crimson Violet","hex":"601441","rgb":[96,20,65],"cmyk":[0,79,32,62],"hsb":[324,79,38],"hsl":[324,66,23],"lab":[21,38,-9]},{"name":"Prussian Blue","hex":"111E3B","rgb":[17,30,59],"cmyk":[71,49,0,77],"hsb":[221,71,23],"hsl":[221,55,15],"lab":[12,6,-20]},{"name":"Space Indigo","hex":"192646","rgb":[25,38,70],"cmyk":[64,46,0,73],"hsb":[223,64,27],"hsl":[223,47,19],"lab":[16,6,-22]},{"name":"Petal Frost","hex":"F8CEDA","rgb":[248,206,218],"cmyk":[0,17,12,3],"hsb":[343,17,97],"hsl":[343,75,89],"lab":[87,17,0]},{"name":"Pink Mist","hex":"EA94AD","rgb":[234,148,173],"cmyk":[0,37,26,8],"hsb":[343,37,92],"hsl":[343,67,75],"lab":[71,36,1]},{"name":"Twilight Indigo","hex":"2A3458","rgb":[42,52,88],"cmyk":[52,41,0,65],"hsb":[227,52,35],"hsl":[227,35,25],"lab":[22,7,-23]}]

XML

<palette>
  <color name="Crimson Violet" hex="601441" r="96" g="20" b="65" />
  <color name="Prussian Blue" hex="111E3B" r="17" g="30" b="59" />
  <color name="Space Indigo" hex="192646" r="25" g="38" b="70" />
  <color name="Petal Frost" hex="F8CEDA" r="248" g="206" b="218" />
  <color name="Pink Mist" hex="EA94AD" r="234" g="148" b="173" />
  <color name="Twilight Indigo" hex="2A3458" r="42" g="52" b="88" />
</palette>

Fotostrip designer

Kies accentkleuren en test ze op een minimal voorbeeldpagina met kleurpicker.

Open kleurpicker voorbeeld

← Terug naar home