HOOFDSTUK 02 · KLEUR

Kleur¶

Atlas Agency is licht met donkere ankers. De basis is wit en mist, de tekst en de zware secties (hero, stappen, call-to-action, footer) zijn inkt, en Agency-blauw doet het werk: knoppen, eyebrows, iconen en de verloopregel in koppen.

De vijf themakleuren zijn de Odoo-kleuren o-color-1 tot en met o-color-5 van website 6. De overige waarden komen uit de merklaag agency.scss.

Palet¶

Diepblauw#0284C7 --ag-color-blue-deep · o-color-1RGB 2, 132, 199 · CMYK 99, 34, 0, 22o-color-1. Primaire themakleur van Odoo, verlopen en accentvlakken.

Agency-blauw#0EA5FF --ag-color-blue · o-color-2RGB 14, 165, 255 · CMYK 95, 35, 0, 0o-color-2. Knoppen, eyebrows op donker, iconen en highlights.

Mist#EEF5FC --ag-color-mist · o-color-3RGB 238, 245, 252 · CMYK 6, 3, 0, 1o-color-3. Lichte sectieachtergrond (o_cc2), chips en tags.

Wit#FFFFFF --ag-color-white · o-color-4RGB 255, 255, 255 · CMYK 0, 0, 0, 0o-color-4. Basisachtergrond, kaarten.

Inkt#0A1628 --ag-color-ink · o-color-5RGB 10, 22, 40 · CMYK 75, 45, 0, 84o-color-5. Tekst, donkere secties (hero, stappen, CTA, footer) en tekst op blauwe knoppen.

Inkt 2#0F2240 --ag-color-ink-2RGB 15, 34, 64 · CMYK 77, 47, 0, 75Tweede donkertint voor vlakken op inkt.

Linkblauw#0272B0 --ag-color-blue-textRGB 2, 114, 176 · CMYK 99, 35, 0, 31Kleine blauwe tekst en links op wit of mist (AA).

Hoverblauw#38B6FF --ag-color-blue-hoverRGB 56, 182, 255 · CMYK 78, 29, 0, 0Hovertoestand van de primaire knop.

Logoblauw#0066CC --ag-color-logo-blueRGB 0, 102, 204 · CMYK 100, 50, 0, 20Alleen in het woordmerk (ATLAS AGENCY). Niet als UI-kleur gebruiken.

Alle waarden in een tabel

Naam	HEX	RGB	CMYK	Odoo
Diepblauw	`#0284C7`	2, 132, 199	99, 34, 0, 22	o-color-1
Agency-blauw	`#0EA5FF`	14, 165, 255	95, 35, 0, 0	o-color-2
Mist	`#EEF5FC`	238, 245, 252	6, 3, 0, 1	o-color-3
Wit	`#FFFFFF`	255, 255, 255	0, 0, 0, 0	o-color-4
Inkt	`#0A1628`	10, 22, 40	75, 45, 0, 84	o-color-5
Inkt 2	`#0F2240`	15, 34, 64	77, 47, 0, 75
Linkblauw	`#0272B0`	2, 114, 176	99, 35, 0, 31
Hoverblauw	`#38B6FF`	56, 182, 255	78, 29, 0, 0
Logoblauw	`#0066CC`	0, 102, 204	100, 50, 0, 20

Transparante waarden¶

Token	Waarde	Waarvoor
`--ag-color-line`	`rgba(10, 22, 40, 0.10)`	Haarlijnen en kaartranden
`--ag-color-muted`	`rgba(10, 22, 40, 0.68)`	Lead en secundaire tekst op licht
`--ag-color-on-ink-muted`	`rgba(255, 255, 255, 0.78)`	Secundaire tekst op inkt
`--ag-color-icon-tile`	`rgba(14, 165, 255, 0.16)`	Achtergrond van icoontegels

Verhouding¶

Gemeten op de homepage van atlasagency.nl (1366 px breed, hele pagina, 3 oktober 2026): ongeveer 44% wit, 17% mist, 28% inkt, 1% blauw en 10% beeld (foto's en screenshots).

Secties wisselen af: wit (o_cc1), mist (o_cc2) en inkt (o_cc5). Op de live site staan twee inkt-secties niet direct onder elkaar.
Blauw is een accent, geen vlakvulling. Uitzondering: de primaire knop en de icoontegel (blauw op 16%).
Verloop alleen in koppen: de accentregel van een kop loopt van #0EA5FF via #7DD3FC naar #E0F2FE. Nergens anders, en nooit in het logo.

Contrast¶

Gemeten volgens WCAG 2.1. AA vraagt 4,5:1 voor gewone tekst en 3:1 voor grote tekst (vanaf 24 px, of 19 px vet).

Aa 18,1:1Inkt op Wit AAA
Bodytekst en koppen op wit

Aa 16,5:1Inkt op Mist AAA
Tekst op mist-secties

Aa 6,8:1Inkt op Agency-blauw AA
Primaire knop: inkt op Agency-blauw

Aa 18,1:1Wit op Inkt AAA
Tekst op donkere secties

Aa 6,8:1Agency-blauw op Inkt AA
Eyebrows en accenten op inkt

Aa 5,2:1Linkblauw op Wit AA
Links en kleine blauwe tekst op wit

Aa 4,7:1Linkblauw op Mist AA
Links op mist

Aa 4,1:1Wit op Diepblauw AA groot
Witte tekst op diepblauw (alleen groot)

Aa 2,7:1Wit op Agency-blauw Niet
Wit op Agency-blauw: niet gebruiken

Aa 2,7:1Agency-blauw op Wit Niet
Agency-blauw als tekst op wit: niet gebruiken

Daarom is de primaire knop inkt op Agency-blauw (6,8:1) en niet wit op blauw (2,7:1). Kleine blauwe tekst op licht is altijd linkblauw #0272B0.

Print¶

CMYK hierboven is een rekenkundige omzetting van RGB en dus indicatief. Laat drukwerk altijd proeven. Er is geen vastgestelde Pantone-kleur voor Agency.