mistyrose
CSS keyword
On white 1.2:1 · Fail
On black 17.44:1 · AAA
Red Colors
Names, HEX, RGB & Contrast
104 named red colors, grouped by lightness. Click any value to copy it.
Light
19 colors
pink
CSS keyword
On white 1.54:1 · Fail
On black 13.65:1 · AAA
lightpink
CSS keyword
On white 1.65:1 · Fail
On black 12.71:1 · AAA
lightcoral
CSS keyword
On white 2.59:1 · Fail
On black 8.1:1 · AAA
salmon
CSS keyword
On white 2.5:1 · Fail
On black 8.4:1 · AAA
light rose
On white 1.49:1 · Fail
On black 14.1:1 · AAA
pale rose
On white 1.54:1 · Fail
On black 13.61:1 · AAA
soft pink
On white 1.73:1 · Fail
On black 12.15:1 · AAA
pale salmon
On white 1.75:1 · Fail
On black 12.01:1 · AAA
light salmon
On white 1.86:1 · Fail
On black 11.31:1 · AAA
peachy pink
On white 2.05:1 · Fail
On black 10.24:1 · AAA
rosa
On white 2.29:1 · Fail
On black 9.16:1 · AAA
blush pink
On white 2.39:1 · Fail
On black 8.79:1 · AAA
blush
On white 2.09:1 · Fail
On black 10.06:1 · AAA
rose pink
On white 2.36:1 · Fail
On black 8.89:1 · AAA
faded pink
On white 2.2:1 · Fail
On black 9.52:1 · AAA
salmon pink
On white 2.52:1 · Fail
On black 8.34:1 · AAA
carnation
On white 2.53:1 · Fail
On black 8.31:1 · AAA
pinkish grey
On white 2.11:1 · Fail
On black 9.93:1 · AAA
Mid-tone
64 colors
rosybrown
CSS keyword
On white 2.81:1 · Fail
On black 7.46:1 · AAA
tomato
CSS keyword
On white 2.95:1 · Fail
On black 7.13:1 · AAA
indianred
CSS keyword
On white 3.98:1 · AA Large
On black 5.28:1 · AA
red
CSS keyword
On white 4:1 · AA Large
On black 5.25:1 · AA
crimson
CSS keyword
On white 4.99:1 · AA
On black 4.21:1 · AA Large
firebrick
CSS keyword
On white 6.68:1 · AA
On black 3.14:1 · AA Large
brown
CSS keyword
On white 7.08:1 · AAA
On black 2.96:1 · Fail
coral pink
On white 2.94:1 · Fail
On black 7.14:1 · AAA
dusty pink
On white 2.66:1 · Fail
On black 7.89:1 · AAA
greyish pink
On white 2.73:1 · Fail
On black 7.69:1 · AAA
melon
On white 2.6:1 · Fail
On black 8.07:1 · AAA
grapefruit
On white 3.12:1 · AA Large
On black 6.74:1 · AA
grey pink
On white 2.7:1 · Fail
On black 7.78:1 · AAA
orange pink
On white 2.75:1 · Fail
On black 7.65:1 · AAA
pinkish orange
On white 2.71:1 · Fail
On black 7.76:1 · AAA
old rose
On white 3.06:1 · AA Large
On black 6.85:1 · AA
dusky pink
On white 3.12:1 · AA Large
On black 6.72:1 · AA
light red
On white 3.36:1 · AA Large
On black 6.26:1 · AA
dirty pink
On white 3.15:1 · AA Large
On black 6.66:1 · AA
watermelon
On white 3.39:1 · AA Large
On black 6.2:1 · AA
ugly pink
On white 3.24:1 · AA Large
On black 6.47:1 · AA
old pink
On white 3.23:1 · AA Large
On black 6.51:1 · AA
pinkish
On white 3.41:1 · AA Large
On black 6.16:1 · AA
brownish pink
On white 3.2:1 · AA Large
On black 6.55:1 · AA
dusty rose
On white 3.51:1 · AA Large
On black 5.97:1 · AA
pastel red
On white 3.79:1 · AA Large
On black 5.54:1 · AA
rose
On white 3.71:1 · AA Large
On black 5.66:1 · AA
lightish red
On white 3.67:1 · AA Large
On black 5.72:1 · AA
reddish pink
On white 3.68:1 · AA Large
On black 5.7:1 · AA
pale red
On white 3.94:1 · AA Large
On black 5.33:1 · AA
strawberry
On white 3.82:1 · AA Large
On black 5.5:1 · AA
red pink
On white 3.8:1 · AA Large
On black 5.53:1 · AA
dusky rose
On white 3.95:1 · AA Large
On black 5.32:1 · AA
pinky red
On white 3.81:1 · AA Large
On black 5.51:1 · AA
orangey red
On white 3.58:1 · AA Large
On black 5.87:1 · AA
dark coral
On white 4.23:1 · AA Large
On black 4.97:1 · AA
faded red
On white 4.35:1 · AA Large
On black 4.83:1 · AA
dark salmon
On white 4.16:1 · AA Large
On black 5.04:1 · AA
orange red
On white 3.53:1 · AA Large
On black 5.95:1 · AA
reddish orange
On white 3.54:1 · AA Large
On black 5.94:1 · AA
pinkish brown
On white 3.85:1 · AA Large
On black 5.45:1 · AA
deep rose
On white 4.64:1 · AA
On black 4.53:1 · AA
reddish grey
On white 4.09:1 · AA Large
On black 5.13:1 · AA
neon red
On white 3.93:1 · AA Large
On black 5.34:1 · AA
reddish
On white 5:1 · AA
On black 4.2:1 · AA Large
red orange
On white 3.6:1 · AA Large
On black 5.83:1 · AA
dusty red
On white 5.12:1 · AA
On black 4.1:1 · AA Large
vermillion
On white 3.96:1 · AA Large
On black 5.31:1 · AA
bright red
On white 3.99:1 · AA Large
On black 5.26:1 · AA
fire engine red
On white 4.03:1 · AA Large
On black 5.22:1 · AA
dark rose
On white 5.19:1 · AA
On black 4.05:1 · AA Large
pinkish red
On white 4.3:1 · AA Large
On black 4.88:1 · AA
dull red
On white 5.39:1 · AA
On black 3.9:1 · AA Large
orangish red
On white 3.91:1 · AA Large
On black 5.38:1 · AA
cherry red
On white 4.2:1 · AA Large
On black 5:1 · AA
tomato red
On white 4.25:1 · AA Large
On black 4.94:1 · AA
light maroon
On white 5.83:1 · AA
On black 3.6:1 · AA Large
cherry
On white 5.66:1 · AA
On black 3.71:1 · AA Large
brick
On white 6.89:1 · AA
On black 3.05:1 · AA Large
lipstick red
On white 6.38:1 · AA
On black 3.29:1 · AA Large
brownish red
On white 6.99:1 · AA
On black 3.01:1 · AA Large
scarlet
On white 6.55:1 · AA
On black 3.21:1 · AA Large
rusty red
On white 6.49:1 · AA
On black 3.24:1 · AA Large
brownish purple
On white 7.9:1 · AAA
On black 2.66:1 · Fail
Dark
21 colors
darkred
CSS keyword
On white 10.01:1 · AAA
On black 2.1:1 · Fail
maroon
CSS keyword
On white 10.95:1 · AAA
On black 1.92:1 · Fail
rust red
On white 7:1 · AAA
On black 3:1 · AA Large
purplish brown
On white 8.42:1 · AAA
On black 2.5:1 · Fail
darkish red
On white 7.77:1 · AAA
On black 2.7:1 · Fail
burnt red
On white 7.73:1 · AAA
On black 2.72:1 · Fail
purple brown
On white 9.32:1 · AAA
On black 2.25:1 · Fail
red brown
On white 8.4:1 · AAA
On black 2.5:1 · Fail
carmine
On white 8.56:1 · AAA
On black 2.45:1 · Fail
deep red
On white 8.81:1 · AAA
On black 2.38:1 · Fail
blood red
On white 8.99:1 · AAA
On black 2.34:1 · Fail
brick red
On white 9.26:1 · AAA
On black 2.27:1 · Fail
indian red
On white 10.18:1 · AAA
On black 2.06:1 · Fail
dark red
On white 10.6:1 · AAA
On black 1.98:1 · Fail
blood
On white 11.77:1 · AAA
On black 1.78:1 · Fail
reddy brown
On white 12.07:1 · AAA
On black 1.74:1 · Fail
claret
On white 13.11:1 · AAA
On black 1.6:1 · Fail
dried blood
On white 16.1:1 · AAA
On black 1.3:1 · Fail
mahogany
On white 16.21:1 · AAA
On black 1.3:1 · Fail
deep brown
On white 17.03:1 · AAA
On black 1.23:1 · Fail
dark maroon
On white 17.56:1 · AAA
On black 1.2:1 · Fail
Copy the whole palette
Every red color on this page, ready to paste into your project.
CSS
:root {
--mistyrose: #ffe4e1;
--pink: #ffc0cb;
--lightpink: #ffb6c1;
--lightcoral: #f08080;
--salmon: #fa8072;
--rosybrown: #bc8f8f;
--tomato: #ff6347;
--indianred: #cd5c5c;
--red: #ff0000;
--crimson: #dc143c;
--firebrick: #b22222;
--brown: #a52a2a;
--darkred: #8b0000;
--maroon: #800000;
--light-rose: #ffc5cb;
--pale-rose: #fdc1c5;
--soft-pink: #fdb0c0;
--pale-salmon: #ffb19a;
--light-salmon: #fea993;
--peachy-pink: #ff9a8a;
--rosa: #fe86a4;
--blush-pink: #fe828c;
--blush: #f29e8e;
--rose-pink: #f7879a;
--faded-pink: #de9dac;
--salmon-pink: #fe7b7c;
--carnation: #fd798f;
--pinkish-grey: #c8aca9;
--coral-pink: #ff6163;
--dusty-pink: #d58a94;
--greyish-pink: #c88d94;
--melon: #ff7855;
--grapefruit: #fd5956;
--grey-pink: #c3909b;
--orange-pink: #ff6f52;
--pinkish-orange: #ff724c;
--old-rose: #c87f89;
--dusky-pink: #cc7a8b;
--light-red: #ff474c;
--dirty-pink: #ca7b80;
--watermelon: #fd4659;
--ugly-pink: #cd7584;
--old-pink: #c77986;
--pinkish: #d46a7e;
--brownish-pink: #c27e79;
--dusty-rose: #c0737a;
--pastel-red: #db5856;
--rose: #cf6275;
--lightish-red: #fe2f4a;
--reddish-pink: #fe2c54;
--pale-red: #d9544d;
--strawberry: #fb2943;
--red-pink: #fa2a55;
--dusky-rose: #ba6873;
--pinky-red: #fc2647;
--orangey-red: #fa4224;
--dark-coral: #cf524e;
--faded-red: #d3494e;
--dark-salmon: #c85a53;
--orange-red: #fd411e;
--reddish-orange: #f8481c;
--pinkish-brown: #b17261;
--deep-rose: #c74767;
--reddish-grey: #997570;
--neon-red: #ff073a;
--reddish: #c44240;
--red-orange: #fd3c06;
--dusty-red: #b9484e;
--vermillion: #f4320c;
--bright-red: #ff000d;
--fire-engine-red: #fe0002;
--dark-rose: #b5485d;
--pinkish-red: #f10c45;
--dull-red: #bb3f3f;
--orangish-red: #f43605;
--cherry-red: #f7022a;
--tomato-red: #ec2d01;
--light-maroon: #a24857;
--cherry: #cf0234;
--brick: #a03623;
--lipstick-red: #c0022f;
--brownish-red: #9e3623;
--scarlet: #be0119;
--rusty-red: #af2f0d;
--brownish-purple: #76424e;
--rust-red: #aa2704;
--purplish-brown: #6b4247;
--darkish-red: #a90308;
--burnt-red: #9f2305;
--purple-brown: #673a3f;
--red-brown: #8b2e16;
--carmine: #9d0216;
--deep-red: #9a0200;
--blood-red: #980002;
--brick-red: #8f1402;
--indian-red: #850e04;
--dark-red: #840000;
--blood: #770001;
--reddy-brown: #6e1005;
--claret: #680018;
--dried-blood: #4b0101;
--mahogany: #4a0100;
--deep-brown: #410200;
--dark-maroon: #3c0008;
} SCSS
$mistyrose: #ffe4e1; $pink: #ffc0cb; $lightpink: #ffb6c1; $lightcoral: #f08080; $salmon: #fa8072; $rosybrown: #bc8f8f; $tomato: #ff6347; $indianred: #cd5c5c; $red: #ff0000; $crimson: #dc143c; $firebrick: #b22222; $brown: #a52a2a; $darkred: #8b0000; $maroon: #800000; $light-rose: #ffc5cb; $pale-rose: #fdc1c5; $soft-pink: #fdb0c0; $pale-salmon: #ffb19a; $light-salmon: #fea993; $peachy-pink: #ff9a8a; $rosa: #fe86a4; $blush-pink: #fe828c; $blush: #f29e8e; $rose-pink: #f7879a; $faded-pink: #de9dac; $salmon-pink: #fe7b7c; $carnation: #fd798f; $pinkish-grey: #c8aca9; $coral-pink: #ff6163; $dusty-pink: #d58a94; $greyish-pink: #c88d94; $melon: #ff7855; $grapefruit: #fd5956; $grey-pink: #c3909b; $orange-pink: #ff6f52; $pinkish-orange: #ff724c; $old-rose: #c87f89; $dusky-pink: #cc7a8b; $light-red: #ff474c; $dirty-pink: #ca7b80; $watermelon: #fd4659; $ugly-pink: #cd7584; $old-pink: #c77986; $pinkish: #d46a7e; $brownish-pink: #c27e79; $dusty-rose: #c0737a; $pastel-red: #db5856; $rose: #cf6275; $lightish-red: #fe2f4a; $reddish-pink: #fe2c54; $pale-red: #d9544d; $strawberry: #fb2943; $red-pink: #fa2a55; $dusky-rose: #ba6873; $pinky-red: #fc2647; $orangey-red: #fa4224; $dark-coral: #cf524e; $faded-red: #d3494e; $dark-salmon: #c85a53; $orange-red: #fd411e; $reddish-orange: #f8481c; $pinkish-brown: #b17261; $deep-rose: #c74767; $reddish-grey: #997570; $neon-red: #ff073a; $reddish: #c44240; $red-orange: #fd3c06; $dusty-red: #b9484e; $vermillion: #f4320c; $bright-red: #ff000d; $fire-engine-red: #fe0002; $dark-rose: #b5485d; $pinkish-red: #f10c45; $dull-red: #bb3f3f; $orangish-red: #f43605; $cherry-red: #f7022a; $tomato-red: #ec2d01; $light-maroon: #a24857; $cherry: #cf0234; $brick: #a03623; $lipstick-red: #c0022f; $brownish-red: #9e3623; $scarlet: #be0119; $rusty-red: #af2f0d; $brownish-purple: #76424e; $rust-red: #aa2704; $purplish-brown: #6b4247; $darkish-red: #a90308; $burnt-red: #9f2305; $purple-brown: #673a3f; $red-brown: #8b2e16; $carmine: #9d0216; $deep-red: #9a0200; $blood-red: #980002; $brick-red: #8f1402; $indian-red: #850e04; $dark-red: #840000; $blood: #770001; $reddy-brown: #6e1005; $claret: #680018; $dried-blood: #4b0101; $mahogany: #4a0100; $deep-brown: #410200; $dark-maroon: #3c0008;
Tailwind
theme: {
extend: {
colors: {
"mistyrose": "#ffe4e1",
"pink": "#ffc0cb",
"lightpink": "#ffb6c1",
"lightcoral": "#f08080",
"salmon": "#fa8072",
"rosybrown": "#bc8f8f",
"tomato": "#ff6347",
"indianred": "#cd5c5c",
"red": "#ff0000",
"crimson": "#dc143c",
"firebrick": "#b22222",
"brown": "#a52a2a",
"darkred": "#8b0000",
"maroon": "#800000",
"light-rose": "#ffc5cb",
"pale-rose": "#fdc1c5",
"soft-pink": "#fdb0c0",
"pale-salmon": "#ffb19a",
"light-salmon": "#fea993",
"peachy-pink": "#ff9a8a",
"rosa": "#fe86a4",
"blush-pink": "#fe828c",
"blush": "#f29e8e",
"rose-pink": "#f7879a",
"faded-pink": "#de9dac",
"salmon-pink": "#fe7b7c",
"carnation": "#fd798f",
"pinkish-grey": "#c8aca9",
"coral-pink": "#ff6163",
"dusty-pink": "#d58a94",
"greyish-pink": "#c88d94",
"melon": "#ff7855",
"grapefruit": "#fd5956",
"grey-pink": "#c3909b",
"orange-pink": "#ff6f52",
"pinkish-orange": "#ff724c",
"old-rose": "#c87f89",
"dusky-pink": "#cc7a8b",
"light-red": "#ff474c",
"dirty-pink": "#ca7b80",
"watermelon": "#fd4659",
"ugly-pink": "#cd7584",
"old-pink": "#c77986",
"pinkish": "#d46a7e",
"brownish-pink": "#c27e79",
"dusty-rose": "#c0737a",
"pastel-red": "#db5856",
"rose": "#cf6275",
"lightish-red": "#fe2f4a",
"reddish-pink": "#fe2c54",
"pale-red": "#d9544d",
"strawberry": "#fb2943",
"red-pink": "#fa2a55",
"dusky-rose": "#ba6873",
"pinky-red": "#fc2647",
"orangey-red": "#fa4224",
"dark-coral": "#cf524e",
"faded-red": "#d3494e",
"dark-salmon": "#c85a53",
"orange-red": "#fd411e",
"reddish-orange": "#f8481c",
"pinkish-brown": "#b17261",
"deep-rose": "#c74767",
"reddish-grey": "#997570",
"neon-red": "#ff073a",
"reddish": "#c44240",
"red-orange": "#fd3c06",
"dusty-red": "#b9484e",
"vermillion": "#f4320c",
"bright-red": "#ff000d",
"fire-engine-red": "#fe0002",
"dark-rose": "#b5485d",
"pinkish-red": "#f10c45",
"dull-red": "#bb3f3f",
"orangish-red": "#f43605",
"cherry-red": "#f7022a",
"tomato-red": "#ec2d01",
"light-maroon": "#a24857",
"cherry": "#cf0234",
"brick": "#a03623",
"lipstick-red": "#c0022f",
"brownish-red": "#9e3623",
"scarlet": "#be0119",
"rusty-red": "#af2f0d",
"brownish-purple": "#76424e",
"rust-red": "#aa2704",
"purplish-brown": "#6b4247",
"darkish-red": "#a90308",
"burnt-red": "#9f2305",
"purple-brown": "#673a3f",
"red-brown": "#8b2e16",
"carmine": "#9d0216",
"deep-red": "#9a0200",
"blood-red": "#980002",
"brick-red": "#8f1402",
"indian-red": "#850e04",
"dark-red": "#840000",
"blood": "#770001",
"reddy-brown": "#6e1005",
"claret": "#680018",
"dried-blood": "#4b0101",
"mahogany": "#4a0100",
"deep-brown": "#410200",
"dark-maroon": "#3c0008",
}
}
} Browse other color families
Copied
Red color names
Red sits at both ends of the hue wheel, roughly 345–15°. It is the most attention-grabbing family on screen, which is why it dominates error states, sale badges and warning icons. The named reds here run from pale salmon and light coral through firebrick and crimson down to dark maroon.
Using these colors
Reds pair naturally with cream and off-white backgrounds, and with deep navy or charcoal when you need contrast without going monochrome. Keep saturated red for a single accent per screen — spread across large surfaces it reads as alarm rather than emphasis. For destructive buttons, pick a red with at least 4.5:1 against its background and reserve the brightest tones for icons and borders.
Contrast and accessibility
Most mid-tone reds fail WCAG AA as text on white, so check the ratios above before using one for body copy. Red-green colour blindness affects roughly 8% of men, so never encode meaning in red alone — pair it with an icon, label or pattern. The darker reds in this list are the safest choices for text.