Hva inngår i en fargepalett for en merkevare?

En merkevarepalett gir hver farge en funksjon. Primærfargen er den folk husker, og brukes i logoen og på hovedknappene. En sekundærfarge støtter den, en aksentfarge får handlingsknapper til å skille seg ut, og en bakgrunnsfarge og tekstfarge binder siden sammen.

Kontrast er like viktig som smak. Retningslinjene for tilgjengelig webinnhold (WCAG) krever et kontrastforhold på minst 4.5:1 mellom vanlig tekst og bakgrunnen, eller 7:1 for det strengere AAA-nivået.

Beskrivelse av verktøyet

Beskriv merkevaren din under Om merkevaren din: hva den gjør, hvem den er for, og hvordan den skal oppleves. Velg en merkevarepersonlighet (Profesjonell, Leken, Luksuriøs, Minimalistisk, Dristig eller Naturlig), eller la den stå på Tilpass beskrivelsen, så utleder KI-en personligheten fra teksten din.

Du får fem navngitte farger: Primær, Sekundær, Aksent, Bakgrunn og Tekst. Utdataformatet veksler mellom HEX, RGB, HSL, CMYK og andre formater, og hver farge har en kopieringsknapp. Bruksveiledningen forteller hvordan du bruker hver farge, og CSS-variabler gir deg en kodeblokk du kan lime inn i et stilark. KI-en blir bedt om å holde kontrastforholdet mellom teksten og bakgrunnen på minst 7:1, og mellom primærfargen og aksentfargen på minst 3:1.

Eksempel

For «Et lokalt kaffebrenneri i Portland. Varmt, innbydende og bærekraftig» kan du for eksempel få en brent brun primærfarge, en kremfarget bakgrunn og en terrakottafarget aksent, med CSS-variabler som disse:

:root {
  --brand-primary: #5b3a29;
  --brand-secondary: #a47551;
  --brand-accent: #d9643a;
  --brand-background: #faf6f0;
  --brand-text: #2b211c;
}

Funksjoner

  • Fem farger med tydelige roller, et navn og et bruksnotat for hver
  • Seks personligheter, eller én som velges ut fra beskrivelsen din
  • Kopier farger i formatet du trenger, eller hele settet som CSS-variabler

Begrensninger

Verktøyet måler ikke kontrast selv, så sjekk tekst- og bakgrunnsfargen med en kontrastsjekker før du tar det i bruk.