Kontrast
Alle farger bør testes for kontrast ved å bruke en online kontrastkontroll for å sikre at den oppfyller WCAG AA-krav for tilgjengelighet. Dette kan du gjøre via plugins i Figma, på nett eller du kan ta i bruk kontrastsjekkeren under.
Bakgrunnsfarge Dark blue 1000 (brand-dark-blue-1000) Dark blue 700 (brand-dark-blue-700) Blue 1000 (brand-blue-1000) Blue 500 (brand-blue-500) Blue 300 (brand-blue-300) Blue 200 (brand-blue-200) Blue 100 (brand-blue-100) Warm blue 1000 (brand-warm-blue-1000) Green 1000 (brand-green-1000) Green 400 (brand-green-400) Light green 1000 (brand-light-green-1000) Light green 400 (brand-light-green-400) Dark green 1000 (brand-dark-green-1000) Yellow 1000 (brand-yellow-1000) Yellow 500 (brand-yellow-500) Red 1000 (brand-red-1000) Red 600 (brand-red-600) Red 400 (brand-red-400) Red 100 (brand-red-100) Light beige 1000 (brand-light-beige-1000) Dark beige 1000 (brand-dark-beige-1000) Neutrals Black (brand-neutrals-black) Neutrals 1000 (brand-neutrals-1000) Neutrals 200 (brand-neutrals-200) Neutrals 100 (brand-neutrals-100) Neutrals White (brand-neutrals-white) Neutrals Transparent (brand-neutrals-transparent) Purple 1000 (brand-purple-1000) Gray 1000 (grays-gray-1000) Gray 900 (grays-gray-900) Gray 800 (grays-gray-800) Gray 700 (grays-gray-700) Gray 600 (grays-gray-600) Gray 500 (grays-gray-500) Gray 400 (grays-gray-400) Gray 300 (grays-gray-300) Gray 200 (grays-gray-200) Gray 100 (grays-gray-100)
Tekstfarge Dark blue 1000 (brand-dark-blue-1000) Dark blue 700 (brand-dark-blue-700) Blue 1000 (brand-blue-1000) Blue 500 (brand-blue-500) Blue 300 (brand-blue-300) Blue 200 (brand-blue-200) Blue 100 (brand-blue-100) Warm blue 1000 (brand-warm-blue-1000) Green 1000 (brand-green-1000) Green 400 (brand-green-400) Light green 1000 (brand-light-green-1000) Light green 400 (brand-light-green-400) Dark green 1000 (brand-dark-green-1000) Yellow 1000 (brand-yellow-1000) Yellow 500 (brand-yellow-500) Red 1000 (brand-red-1000) Red 600 (brand-red-600) Red 400 (brand-red-400) Red 100 (brand-red-100) Light beige 1000 (brand-light-beige-1000) Dark beige 1000 (brand-dark-beige-1000) Neutrals Black (brand-neutrals-black) Neutrals 1000 (brand-neutrals-1000) Neutrals 200 (brand-neutrals-200) Neutrals 100 (brand-neutrals-100) Neutrals White (brand-neutrals-white) Neutrals Transparent (brand-neutrals-transparent) Purple 1000 (brand-purple-1000) Gray 1000 (grays-gray-1000) Gray 900 (grays-gray-900) Gray 800 (grays-gray-800) Gray 700 (grays-gray-700) Gray 600 (grays-gray-600) Gray 500 (grays-gray-500) Gray 400 (grays-gray-400) Gray 300 (grays-gray-300) Gray 200 (grays-gray-200) Gray 100 (grays-gray-100)
Stor tekst - 18pt/24px
Oslo er kjent for sin bærekraftige livsstil, med et omfattende nettverk av sykkelstier og et førsteklasses kollektivtransportsystem.
Normal tekst - 16px
Oslo er kjent for sin bærekraftige livsstil, med et omfattende nettverk av sykkelstier og et førsteklasses kollektivtransportsystem. Mat- og drikkeopplevelsene er varierte og spenner fra Michelin-stjerne restauranter til koselige kafeer som serverer deilige kanelboller og kaffe.
Tilgjengelighet for fargeblinde
Det er en god idé å teste fargene du planlegger å bruke med en fargeblindesimuleringsapp, for eksempel Color Oracle. Du kan bruke simuleringen til å justere fargekombinasjonene for å være tilgjengelige.