Brun gradient: kaffe, karamel og jordfarver med koder

En brun gradient er i virkeligheden en mørk, dæmpet orange, der blandes fra dyb til lys: espresso til crema, chokolade til karamel, ler til sand. Lad den varme kulør løbe gennem hvert stop, så ser brun rig, hyggelig og håndlavet ud. Lad den glide mod gråt eller grønt, og den ligner mudder. Herunder finder du koder til kaffe-, karamel-, chokolade-, jord- og whiskybrune toner og de farver, der passer til dem.

Derfor bliver brune gradienter mudrede

Der er ingen brun i regnbuen. Det, vi kalder brun, er orange eller rød med lysstyrken skruet ned og mætningen dæmpet. Det har en praktisk konsekvens: Mister et stop i din gradient sin varme, fordi der er for meget gråt eller et strejf af grønt, virker hele blandingen beskidt. Hold hvert stop på den varme side, og gør farven mørkere ved at sænke lysstyrken i stedet for at tilsætte sort. Mudrede gradienter viser effekten side om side.

Du kan bygge din egen brune gradient ud fra en hvilken som helst orange i en farvevælger, der viser kulør, mætning og lysstyrke. Det tager fire greb:

1. 1

   Vælg en varm kulør

   Vælg en kulør mellem cirka 20 og 40 grader: lavere til rødlige brune toner som mursten og terrakotta, højere til gyldne som karamel.

2. 2

   Dæmp mætningen

   Sæt mætningen ned til et sted mellem 35 % og 65 %. Fuldt mættet forbliver den orange, og for lav bliver den grå.

3. 3

   Sæt tre lysstyrkestop

   Brug samme kulør i tre lysstyrker, for eksempel 10 %, 30 % og 60 %. Den spredning er det, der gør blandingen synlig.

4. 4

   Gør den lyse ende lidt varmere

   Skub det lyseste stop et par grader mod gult. Ægte lys på træ, kaffe eller ler ser varmere ud i højlysene.

Koder til kaffegradienter

Kaffebrune toner er de mest brugbare i sættet. Espresso er næsten sort og bærer lys skrift med reel dybde. Crema pour løber fra det lyse skum øverst i en kop ned i kaffen under. Mokka ligger imellem og giver en stærk, neutral baggrund til menukort og prislister.

Caféer og kaffebrænderier finder en hel identitet bygget på disse toner i branding af en kaffebar og idéer til poser og etiketter i emballage til kaffebrænderier.

Koder til karamel- og chokoladegradienter

Karamel er brun på sit mest gyldne og venlige. Den gløder, hvilket gør den ideel til bagerier, honning, efterårstilbud og alt sødt. Chokolade er det modsatte: dyb, blank og forkælende. En radial gradient med et blødt højlys giver chokolade den glans, den har i virkeligheden.

Gradienter i jord, ler og terrakotta

Jordbrune toner læner sig mod rødt og føles håndlavede: ler, mursten, læder, valnød. De passer til keramik, plantebutikker, outdoorudstyr og alt med et naturligt eller middelhavsagtigt præg. Især terrakotta er blevet en favorit hos varme, moderne brands, fordi den både virker jordnær og frisk.

Vil du udvide dem til et helt farveskema, så se jordfarver og efterårsfarvepaletter. Til den lysere ende af familien, sand og havre, tager koderne i beige gradient over, hvor ørkenler slipper.

Sådan holder du en lang brun blanding varm i CSS

Browsere blander gradienter i sRGB som standard, og en lang blanding fra en dyb brun til en lys karamel kan sunke ned i en lettere grålig midte. Beder du browseren interpolere i OKLCH, holdes kulør og farvemætning mere stabile fra ende til anden. Det understøttes i aktuelle versioner af de store browsere, og hex-reserven dækker resten.

.brown-hero {
  /* fallback for older browsers */
  background: linear-gradient(160deg, #2a1810 0%, #a85f24 55%, #fbe3b8 100%);
  /* steadier warmth through the middle */
  background: linear-gradient(160deg in oklch, oklch(0.24 0.04 45) 0%, oklch(0.52 0.11 55) 55%, oklch(0.92 0.06 80) 100%);
}

CSS-gradienter i OKLCH forklarer farverummet, og hvornår den ekstra linje er umagen værd.

Hvad du kan parre med en brun gradient

En brun gradient i et rigtigt opslag

Brune baggrunde bærer varme hverdagsnyheder særligt godt: en ny ristning, en sæsonbagt kage, en workshop. Cremefarvet skrift på den dybe ende er det sikre valg, og en sennep- eller karamelaccent på ét ord giver lidt energi. Idéer til bageriets Instagram har en måneds opslag, der passer til disse toner.

Hvis du poster ugentligt, er det svære at holde hvert opslag i den samme varme brune tone. Med Gradiently vælger du en varm brun Mark én gang, og alle skabeloner, stories og menukort bærer den, mens Automatisk tekstfarve vælger creme eller espresso som skriftfarve linje for linje, så intet går tabt i de mørkere hjørner.