Orange gradient: 25 varme koder fra fersken til brændt orange

En orange gradient blander to eller flere orange nuancer, ofte med en nabofarve som gul, rød eller pink, og få blandinger føles varmere. Lyse fersken- og abrikosversioner føles bløde og imødekommende, klar mandarin føles højlydt og legesyg, og brændt orange eller rust føles jordnær og voksen. Nedenfor er 25 koder ordnet efter de stemninger, efterfulgt af hvad du kan kombinere dem med, og hvordan du sætter tekst på dem uden at miste dine ord.

Bløde orange gradienter: fersken og abrikos

Blege orange nuancer er den venligste vej ind i farven. De ligger tæt på hud, brød og sent eftermiddagslys, og derfor læner bagerier, hudpleje og børnebrands sig op ad dem. Hold det lyseste stop næsten cremefarvet, så blandingen har et roligt sted at hvile. En hel artikel om den blegeste ende finder du i ferskengradienter.

Klare orange gradienter: mandarin og citrus

Mættet orange er ren energi. Den passer til udsalg, madlevering, sport, festivaler og alt, der skal bemærkes i miniaturestørrelse. Risikoen er, at klar orange bliver til én flad, højlydt blok, så giv den et lysere stop mod gul eller et dybere mod rød. Det lille skift er det, der får den til at ligne lys frem for maling.

Solnedgangs- og ravfarvede orange gradienter

Lader du orange løbe lodret fra guld foroven til rød eller blomme forneden, får du en solnedgang, nok den mest velkendte gradient, der findes. Ravblandinger er den stille fætter: honning, marmelade og whisky, toner der føles fyldige uden at råbe. Vil du have hele himlen med, går solnedgangsgradienter videre.

Gradienter i brændt orange og rust

Skubber du orange mod brun, bliver den til terrakotta, rust og kobber: farver fra lerkrukker, efterårsblade og gammelt læder. De føles gennemarbejdede og overvejede, så de passer til indretning, kaffe, keramik, friluftsbrands og alt med en historie om håndværk. De bærer også hvid tekst langt bedre end klar orange.

Orange lys på en mørk bund

Den mest eksklusive måde at bruge orange på er sparsomt. Start fra næsten sort, en dyb brun eller en marineblå, og lad ét orange lys gløde fra et hjørne som en glød eller en gadelygte. Det er behandlingen til sene arrangementer, restauranter, musik og alt, der skal føles varmt efter mørkets frembrud. Mørke blandinger får let striber, så læs mørke gradientbaggrunde, før du eksporterer.

Farver, der passer til en orange gradient

Orange har to slags gode partnere. Naboer som gul, pink og rød glider direkte over i den. Modsætninger som dyb blå og petrol får den til at vibrere, men de skal stå ved siden af det orange som en accent, ikke inde i samme blanding, for midtpunktet mellem dem bliver gråt. Mudrede gradienter forklarer hvorfor, og komplementærfarver viser, hvordan du bruger spændingen sikkert.

Tekst på orange gradienter

Det er her, de fleste orange designs fejler. Hvid på klar mandarin ser kraftfuld ud, men har et kontrastforhold på cirka 2,8 til 1, langt under de 4,5 til 1, som WCAG kræver til brødtekst. Næsten sort på samme orange når over 6 til 1. Reglen er enkel: mørk tekst på lyse og klare orange nuancer, hvid tekst kun fra brændt orange og nedefter. Hele metoden står i farvekontrast og tilgængelighed.

Gradiently klarer den del for dig. En Mark ved, hvor ordene står: den flytter sit roligste område om bag dem, og Automatisk tekstfarve vælger lys eller mørk tekst linje for linje fra Markens egen palet, så et orange design forbliver læsbart i alle størrelser uden bokse eller skygger.

CSS til orange gradienter

Hver kode ovenfor er en enkelt CSS-værdi, du kan indsætte i background. Til en sektion, der både skal have varme og dybde, lægger du et radialt lys over en lineær bund, og du sætter altid en ensfarvet reservefarve. Læs lineære gradienter i CSS for hele syntaksen.

.hero {
  background-color: #9a3412; /* fallback */
  background-image:
    radial-gradient(circle at 78% 22%, #fdba74 0%, transparent 40%),
    linear-gradient(160deg, #f97316 0%, #c2410c 55%, #7c2d12 100%);
  color: #ffffff; /* safe here: the words sit on the darker lower half */
}

Vil du have et orange look, som ingen andre poster, så kig efter varme Marks i Markedet: søg på ord som »brændt orange« eller »abrikos«, design gratis med enhver Mark, der ikke er sikret, og sikr dig den, hvis den bliver dit brand.