Instruksjoner til AI-fargepalettgenerator som gir brukbare paletter

Enhver dyktig chatassistent kan fungere som en AI-fargepalettgenerator, og forskjellen mellom en pen liste og en brukbar palett ligger i instruksjonen. Be om fem til sju farger, hver med en jobb (bakgrunn, tekst, aksent, flate, kant), et navn og en hex-kode, og beskriv et ekte sted eller materiale i stedet for en stil. Sjekk deretter hvert par som skal bære tekst med et kontrastverktøy, fordi assistenter ofte oppgir kontrastforhold de aldri har regnet ut. Instruksjonene og sjekkene under tar omtrent ti minutter.

Hvorfor generiske instruksjoner gir generiske paletter

«Gi meg en moderne pastellpalett» ber modellen om det mest typiske svaret på en svært vanlig forespørsel. Du får den samme mintgrønne, rosa og syrinfargede som alle gratisgeneratorer tilbyr. To endringer løser det meste: gi fargene jobber, og gi assistenten noe konkret å se for seg.

En palettinstruksjon du kan kopiere

Lag en fargepalett for [bedrift, én linje] rettet mot [målgruppe].
Stemning: [tre ord]. Inspirert av: [et ekte sted, materiale eller øyeblikk].
Unngå: [farger eller klisjeer du ikke vil ha].

Gi meg 6 farger som en tabell: rolle, navn, hex.
Roller: bakgrunn, mørk tekst, lys tekst, hovedfarge, aksent (brukes sparsomt), myk flate.
Si så hvilke par som skal bære tekst.
Ikke oppgi kontrastforhold; dem sjekker jeg selv.

Linjen «inspirert av» gjør det tunge løftet. «En havn klokka seks om morgenen», «terrakottafliser etter regn» eller «innsiden av en gammel bokhandel» gir modellen noe med ekte fargeforhold, og det er derfor de slår stilbetegnelser. Fargepalett fra et bilde bruker den samme ideen med et foto i stedet for ord.

Et gjennomarbeidet eksempel

Her er den typen resultat du kan forvente fra en instruksjon for en liten blomsterbutikk, inspirert av «et kaldt drivhus tidlig på våren», med stemningsordene rolig, frisk og stille eksklusiv.

Gjør den om til en bakgrunn før du vurderer den. Fargeprøver på rad ser alltid ryddige ut; farger blandet sammen viser deg om familien virkelig hører sammen, eller om den blir grumsete der fargene møtes.

Slik sjekker du kontrasten i en palett skikkelig

Språkmodeller forutsier tekst; de regner ikke. En modell kan si at et par består når det ikke gjør det. Lim inn hvert tekstpar i et verktøy som WebAIMs kontrastsjekker og bruk WCAG-tersklene.

Hvis et par ikke består, still assistenten et smalt oppfølgingsspørsmål: «Gjør den mørke tekstfargen mørkere til den når 4,5:1 på den myke flaten, og behold fargetonen.» Mål så igjen. Fargekontrast og tilgjengelighet forklarer forholdstallene, og fargeblindhet i design dekker par som består kontrastkravet, men fortsatt forvirrer noen lesere, som rødt og grønt med lik lyshet.

Oppfølgingsinstruksjoner som forbedrer en palett

• «Gi meg en lys versjon av denne paletten som beholder samme karakter, med de samme rollene.»
• «Hvilken farge her ligger nærmest det konkurrentene mine bruker? Bytt den ut med noe som skiller seg ut.»
• «Skriv hver farge i oklch() i tillegg til hex, og hold jevne lyshetstrinn mellom de grønne.»
• «Foreslå en fordeling på 60, 30, 10 for et innlegg i sosiale medier med denne paletten.»
• «Skriv egendefinerte CSS-egenskaper for disse fargene, navngitt etter rolle, ikke fargetone.»

Den siste er nyttig hvis du bygger for nettet: navngivning etter rolle (--ground, --text-deep) lar deg bytte paletten senere uten å røre hver regel. 60 30 10-regelen forklarer fordelingen, og OKLCH forklart viser hvorfor jevne lyshetstrinn gir renere overganger.

:root {
  --ground: #0f1f1a;
  --text-deep: #1f3b32;
  --main: #4d7c66;
  --accent: #e8a0a8;
  --text-light: #eef2ec;
  --surface-soft: #c9d6cc;
}

Test paletten på ekte design

En palett beviser seg i en travel feed, ikke i en chat. Lag tre ekte arbeider med den: en kunngjøring, et sitat og et salgsinnlegg, i størrelsene du faktisk publiserer i. Begynner aksenten å dukke opp overalt, er den ikke lenger en aksent.

I Gradiently ligger palettene i merkevaresettet, og en Mark holder ordene lesbare av seg selv: det roligste området flytter seg bak teksten, og Auto-tekstfarge velger lys eller mørk tekst per linje fra Markens egne farger, så ordene forblir lesbare i alle størrelser. Fargepalettgenerator dekker veier til en palett uten AI hvis du heller vil starte for hånd.