Oransje farger

navn, HEX, RGB og kontrast

31 oransje farger, gruppert etter lyshet. Klikk på en verdi for å kopiere den.

Lyse

15 farger

oldlace

CSS-nøkkelord

På hvitt 1.08:1 · Fail

På svart 19.38:1 · AAA

linen

CSS-nøkkelord

På hvitt 1.12:1 · Fail

På svart 18.67:1 · AAA

cornsilk

CSS-nøkkelord

På hvitt 1.07:1 · Fail

På svart 19.71:1 · AAA

papayawhip

CSS-nøkkelord

På hvitt 1.13:1 · Fail

På svart 18.56:1 · AAA

antiquewhite

CSS-nøkkelord

På hvitt 1.17:1 · Fail

På svart 17.93:1 · AAA

blanchedalmond

CSS-nøkkelord

På hvitt 1.17:1 · Fail

På svart 18.02:1 · AAA

bisque

CSS-nøkkelord

På hvitt 1.22:1 · Fail

På svart 17.15:1 · AAA

peachpuff

CSS-nøkkelord

På hvitt 1.31:1 · Fail

På svart 15.98:1 · AAA

moccasin

CSS-nøkkelord

På hvitt 1.23:1 · Fail

På svart 17.02:1 · AAA

navajowhite

CSS-nøkkelord

På hvitt 1.29:1 · Fail

På svart 16.3:1 · AAA

wheat

CSS-nøkkelord

På hvitt 1.31:1 · Fail

På svart 15.98:1 · AAA

lightsalmon

CSS-nøkkelord

På hvitt 1.99:1 · Fail

På svart 10.56:1 · AAA

burlywood

CSS-nøkkelord

På hvitt 1.86:1 · Fail

På svart 11.31:1 · AAA

peach

På hvitt 1.79:1 · Fail

På svart 11.75:1 · AAA

apricot

På hvitt 1.79:1 · Fail

På svart 11.76:1 · AAA

Middels

16 farger

darksalmon

CSS-nøkkelord

På hvitt 2.31:1 · Fail

På svart 9.11:1 · AAA

sandybrown

CSS-nøkkelord

På hvitt 2.03:1 · Fail

På svart 10.33:1 · AAA

coral

CSS-nøkkelord

På hvitt 2.5:1 · Fail

På svart 8.4:1 · AAA

peru

CSS-nøkkelord

På hvitt 2.99:1 · Fail

På svart 7.02:1 · AAA

darkorange

CSS-nøkkelord

På hvitt 2.33:1 · Fail

På svart 9:1 · AAA

orange

CSS-nøkkelord

På hvitt 1.97:1 · Fail

På svart 10.63:1 · AAA

orangered

CSS-nøkkelord

På hvitt 3.44:1 · AA Large

På svart 6.1:1 · AA

sand

På hvitt 1.62:1 · Fail

På svart 12.94:1 · AAA

golden yellow

På hvitt 1.58:1 · Fail

På svart 13.3:1 · AAA

terracotta

På hvitt 3.83:1 · AA Large

På svart 5.49:1 · AA

tangerine

På hvitt 2.21:1 · Fail

På svart 9.49:1 · AAA

amber

På hvitt 1.8:1 · Fail

På svart 11.67:1 · AAA

terra cotta

På hvitt 3.91:1 · AA Large

På svart 5.37:1 · AA

pumpkin orange

På hvitt 2.61:1 · Fail

På svart 8.04:1 · AAA

marigold

På hvitt 1.66:1 · Fail

På svart 12.68:1 · AAA

orange yellow

På hvitt 1.87:1 · Fail

På svart 11.23:1 · AAA

Kopier hele paletten

Alle oransje fargene på denne siden, klare til å limes inn i prosjektet ditt.

CSS
:root {
  --oldlace: #fdf5e6;
  --linen: #faf0e6;
  --cornsilk: #fff8dc;
  --papayawhip: #ffefd5;
  --antiquewhite: #faebd7;
  --blanchedalmond: #ffebcd;
  --bisque: #ffe4c4;
  --peachpuff: #ffdab9;
  --moccasin: #ffe4b5;
  --navajowhite: #ffdead;
  --wheat: #f5deb3;
  --lightsalmon: #ffa07a;
  --burlywood: #deb887;
  --darksalmon: #e9967a;
  --sandybrown: #f4a460;
  --coral: #ff7f50;
  --peru: #cd853f;
  --darkorange: #ff8c00;
  --orange: #ffa500;
  --orangered: #ff4500;
  --peach: #ffb07c;
  --apricot: #ffb16d;
  --sand: #e2ca76;
  --golden-yellow: #fec615;
  --terracotta: #ca6641;
  --tangerine: #ff9408;
  --amber: #feb308;
  --terra-cotta: #c9643b;
  --pumpkin-orange: #fb7d07;
  --marigold: #fcc006;
  --orange-yellow: #ffad01;
}
SCSS
$oldlace: #fdf5e6;
$linen: #faf0e6;
$cornsilk: #fff8dc;
$papayawhip: #ffefd5;
$antiquewhite: #faebd7;
$blanchedalmond: #ffebcd;
$bisque: #ffe4c4;
$peachpuff: #ffdab9;
$moccasin: #ffe4b5;
$navajowhite: #ffdead;
$wheat: #f5deb3;
$lightsalmon: #ffa07a;
$burlywood: #deb887;
$darksalmon: #e9967a;
$sandybrown: #f4a460;
$coral: #ff7f50;
$peru: #cd853f;
$darkorange: #ff8c00;
$orange: #ffa500;
$orangered: #ff4500;
$peach: #ffb07c;
$apricot: #ffb16d;
$sand: #e2ca76;
$golden-yellow: #fec615;
$terracotta: #ca6641;
$tangerine: #ff9408;
$amber: #feb308;
$terra-cotta: #c9643b;
$pumpkin-orange: #fb7d07;
$marigold: #fcc006;
$orange-yellow: #ffad01;
Tailwind
theme: {
  extend: {
    colors: {
      "oldlace": "#fdf5e6",
      "linen": "#faf0e6",
      "cornsilk": "#fff8dc",
      "papayawhip": "#ffefd5",
      "antiquewhite": "#faebd7",
      "blanchedalmond": "#ffebcd",
      "bisque": "#ffe4c4",
      "peachpuff": "#ffdab9",
      "moccasin": "#ffe4b5",
      "navajowhite": "#ffdead",
      "wheat": "#f5deb3",
      "lightsalmon": "#ffa07a",
      "burlywood": "#deb887",
      "darksalmon": "#e9967a",
      "sandybrown": "#f4a460",
      "coral": "#ff7f50",
      "peru": "#cd853f",
      "darkorange": "#ff8c00",
      "orange": "#ffa500",
      "orangered": "#ff4500",
      "peach": "#ffb07c",
      "apricot": "#ffb16d",
      "sand": "#e2ca76",
      "golden-yellow": "#fec615",
      "terracotta": "#ca6641",
      "tangerine": "#ff9408",
      "amber": "#feb308",
      "terra-cotta": "#c9643b",
      "pumpkin-orange": "#fb7d07",
      "marigold": "#fcc006",
      "orange-yellow": "#ffad01",
    }
  }
}

Bla gjennom andre fargefamilier

Kopiert

Oransje fargenavn

Oransje dekker fargetone 15–45° ved høyere metning og lyshet — båndet mellom rødt og gult, før det mørkner til brunt. Det oppleves varmt og energisk, og er familien som sterkest forbindes med handlingsoppfordringer, mat og høstpaletter.

Slik bruker du disse fargene

Oransje fungerer godt mot dyp blå og turkis, som ligger rett overfor på fargesirkelen. Det er en sterk sekundæraksent når primærfargen er blå, og en god måte å fremheve noe på uten hastverket rødt bærer med seg. Store flate felt med ren oransje sliter ut øyet raskt, så bruk lysere nyanser til bakgrunner og spar full metning til knapper og merker.

Kontrast og tilgjengelighet

Oransje er en av de vanskeligste familiene å bruke tilgjengelig: mellomtoner stryker ofte mot både hvitt og svart. Trenger du oransje tekst, gå mørkere enn det føles naturlig — eller plasser oransjen på en mørk flate og støtt deg på kontrasttallet mot svart over. For knapper går oransje bakgrunn med svart tekst som regel lettere gjennom enn hvit tekst.