Lista de Cores RGB - Todos os Nomes CSS, Códigos e Hex

Esta lista é um guia para todas as cores definidas no CSS e seus respectivos códigos RGB e Hexadecimal.

Em CSS, você pode definir uma cor de diversas formas:

  • Pelo nome da cor, ex: black, white, red.
  • Pelo código hexadecimal (forma mais comum), ex: #000000, #FFFFFF, #FF0000.
  • Pela função rgb ou rgba, passando os valores RGB em decimal, ex: rgb(0, 0, 0), rgb(255, 255, 255).

Lista de cores RGB no CSS

Vermelho

Cor Nome RGB Hex RGB Decimal
lightsalmon#FFA07Argb(255,160,122)
salmon#FA8072rgb(250,128,114)
darksalmon#E9967Argb(233,150,122)
lightcoral#F08080rgb(240,128,128)
indianred#CD5C5Crgb(205,92,92)
crimson#DC143Crgb(220,20,60)
firebrick#B22222rgb(178,34,34)
red#FF0000rgb(255,0,0)
darkred#8B0000rgb(139,0,0)

Laranja

Cor Nome RGB Hex RGB Decimal
coral#FF7F50rgb(255,127,80)
tomato#FF6347rgb(255,99,71)
orangered#FF4500rgb(255,69,0)
gold#FFD700rgb(255,215,0)
orange#FFA500rgb(255,165,0)
darkorange#FF8C00rgb(255,140,0)

Marrom

Cor Nome RGB Hex RGB Decimal
cornsilk#FFF8DCrgb(255,248,220)
blanchedalmond#FFEBCDrgb(255,235,205)
bisque#FFE4C4rgb(255,228,196)
navajowhite#FFDEADrgb(255,222,173)
wheat#F5DEB3rgb(245,222,179)
burlywood#DEB887rgb(222,184,135)
tan#D2B48Crgb(210,180,140)
rosybrown#BC8F8Frgb(188,143,143)
sandybrown#F4A460rgb(244,164,96)
goldenrod#DAA520rgb(218,165,32)
peru#CD853Frgb(205,133,63)
chocolate#D2691Ergb(210,105,30)
saddlebrown#8B4513rgb(139,69,19)
sienna#A0522Drgb(160,82,45)
brown#A52A2Argb(165,42,42)
maroon#800000rgb(128,0,0)

Amarelo

Cor Nome RGB Hex RGB Decimal
lightyellow#FFFFE0rgb(255,255,224)
lemonchiffon#FFFACDrgb(255,250,205)
lightgoldenrodyellow#FAFAD2rgb(250,250,210)
papayawhip#FFEFD5rgb(255,239,213)
moccasin#FFE4B5rgb(255,228,181)
peachpuff#FFDAB9rgb(255,218,185)
palegoldenrod#EEE8AArgb(238,232,170)
khaki#F0E68Crgb(240,230,140)
darkkhaki#BDB76Brgb(189,183,107)
yellow#FFFF00rgb(255,255,0)

Verde

Cor Nome RGB Hex RGB Decimal
lawngreen#7CFC00rgb(124,252,0)
chartreuse#7FFF00rgb(127,255,0)
limegreen#32CD32rgb(50,205,50)
lime#00FF00rgb(0.255.0)
forestgreen#228B22rgb(34,139,34)
green#008000rgb(0,128,0)
darkgreen#006400rgb(0,100,0)
greenyellow#ADFF2Frgb(173,255,47)
yellowgreen#9ACD32rgb(154,205,50)
springgreen#00FF7Frgb(0,255,127)
mediumspringgreen#00FA9Argb(0,250,154)
lightgreen#90EE90rgb(144,238,144)
palegreen#98FB98rgb(152,251,152)
darkseagreen#8FBC8Frgb(143,188,143)
mediumseagreen#3CB371rgb(60,179,113)
seagreen#2E8B57rgb(46,139,87)
olive#808000rgb(128,128,0)
darkolivegreen#556B2Frgb(85,107,47)
olivedrab#6B8E23rgb(107,142,35)

Ciano

Cor Nome RGB Hex RGB Decimal
lightcyan#E0FFFFrgb(224,255,255)
cyan#00FFFFrgb(0,255,255)
aqua#00FFFFrgb(0,255,255)
aquamarine#7FFFD4rgb(127,255,212)
mediumaquamarine#66CDAArgb(102,205,170)
paleturquoise#AFEEEErgb(175,238,238)
turquoise#40E0D0rgb(64,224,208)
mediumturquoise#48D1CCrgb(72,209,204)
darkturquoise#00CED1rgb(0,206,209)
lightseagreen#20B2AArgb(32,178,170)
cadetblue#5F9EA0rgb(95,158,160)
darkcyan#008B8Brgb(0,139,139)
teal#008080rgb(0,128,128)

Azul

Cor Nome RGB Hex RGB Decimal
powderblue#B0E0E6rgb(176,224,230)
lightblue#ADD8E6rgb(173,216,230)
lightskyblue#87CEFArgb(135,206,250)
skyblue#87CEEBrgb(135,206,235)
deepskyblue#00BFFFrgb(0,191,255)
lightsteelblue#B0C4DErgb(176,196,222)
dodgerblue#1E90FFrgb(30,144,255)
cornflowerblue#6495EDrgb(100,149,237)
steelblue#4682B4rgb(70,130,180)
royalblue#4169E1rgb(65,105,225)
blue#0000FFrgb(0,0,255)
mediumblue#0000CDrgb(0,0,205)
darkblue#00008Brgb(0,0,139)
navy#000080rgb(0,0,128)
midnightblue#191970rgb(25,25,112)
mediumslateblue#7B68EErgb(123,104,238)
slateblue#6A5ACDrgb(106,90,205)
darkslateblue#483D8Brgb(72,61,139)

Roxo

Cor Nome RGB Hex RGB Decimal
lavender#E6E6FArgb(230,230,250)
thistle#D8BFD8rgb(216,191,216)
plum#DDA0DDrgb(221,160,221)
violet#EE82EErgb(238,130,238)
orchid#DA70D6rgb(218,112,214)
fuchsia#FF00FFrgb(255,0,255)
magenta#FF00FFrgb(255,0,255)
mediumorchid#BA55D3rgb(186,85,211)
mediumpurple#9370DBrgb(147,112,219)
blueviolet#8A2BE2rgb(138,43,226)
darkviolet#9400D3rgb(148,0,211)
darkorchid#9932CCrgb(153,50,204)
darkmagenta#8B008Brgb(139,0,139)
purple#800080rgb(128,0,128)
indigo#4B0082rgb(75,0,130)

Rosa

Cor Nome RGB Hex RGB Decimal
pink#FFC0CBrgb(255,192,203)
lightpink#FFB6C1rgb(255,182,193)
hotpink#FF69B4rgb(255,105,180)
deeppink#FF1493rgb(255,20,147)
palevioletred#DB7093rgb(219,112,147)
mediumvioletred#C71585rgb(199,21,133)

Branco

Cor Nome RGB Hex RGB Decimal
white#FFFFFFrgb(255,255,255)
snow#FFFAFArgb(255,250,250)
honeydew#F0FFF0rgb(240,255,240)
mintcream#F5FFFArgb(245,255,250)
azure#F0FFFFrgb(240,255,255)
aliceblue#F0F8FFrgb(240,248,255)
ghostwhite#F8F8FFrgb(248,248,255)
whitesmoke#F5F5F5rgb(245,245,245)
seashell#FFF5EErgb(255,245,238)
beige#F5F5DCrgb(245,245,220)
oldlace#FDF5E6rgb(253,245,230)
floralwhite#FFFAF0rgb(255,250,240)
ivory#FFFFF0rgb(255,255,240)
antiquewhite#FAEBD7rgb(250,235,215)
linen#FAF0E6rgb(250,240,230)
lavenderblush#FFF0F5rgb(255,240,245)
mistyrose#FFE4E1rgb(255,228,225)

Cinza

Cor Nome RGB Hex RGB Decimal
gainsboro#DCDCDCrgb(220,220,220)
lightgray / lightgrey#D3D3D3rgb(211,211,211)
silver#C0C0C0rgb(192,192,192)
darkgray / darkgrey#A9A9A9rgb(169,169,169)
gray / grey#808080rgb(128,128,128)
dimgray / dimgrey#696969rgb(105,105,105)
lightslategray / lightslategrey#778899rgb(119,136,153)
slategray / slategrey#708090rgb(112,128,144)
darkslategray / darkslategrey#2F4F4Frgb(47,79,79)
black#000000rgb(0,0,0)

Como funciona o RGB?

RGB significa "Red, Green, Blue", ou seja: "Vermelho, Verde, Azul". São três valores, que podem ser representados com inteiros de 0-255, no formato (255, 0, 0) (vermelho = 255, verde = 0, azul = 0), por exemplo. Ou hexadecimal, de 00-FF: #FF0000 (vermelho = FF, verde = 0, azul = 0).

Quando definimos um valor alto para a cor vermelho, por exemplo, e anulamos os valores de verde e azul na ordem da sigla RGB, nós criamos a cor vermelho. Se fizermos (0, 0, 255), vamos criar a cor azul.

Como aplicar a cor em um estilo CSS

Para aplicar uma cor, você deverá definir um estilo CSS, o que pode fazer de três maneiras:

Através de um estilo inline:

<span style="color: green">Olá mundo</span>

Através da tag style:

<style>
	span.text {
		color: green;
	}
</style>

<span class="green">Olá mundo</span>

Através de uma folha de estilos, ex: styles.css:

span.text {
	color: green;
}

Este artigo foi útil pra você?

Ricardo Metring

Ricardo Metring

Sou desenvolvedor full stack e co-fundador da Criar.io.
Trabalho há 10 anos com programação e sempre interessado em aprender mais.

Artigos relacionados