Skip to content

Cor nomeada do CSS

Cor Crimson #DC143C

Crimson (palavra-chave crimson no CSS) tem o código hex #DC143C e o valor RGB rgb(220, 20, 60): um vermelho vivo e médio-escuro.

Crimson#DC143C

A palavra carmesim vem do corante do inseto quermes (do árabe qirmiz). O valor do CSS é um vermelho profundo, levemente rosado, mais escuro e frio que o red, muito usado em estados de erro.

Códigos da cor Crimson

Códigos da cor Crimson
Palavra-chave CSScrimson
HEX#DC143C
RGBrgb(220, 20, 60)
HSLhsl(348, 83%, 47%)
HWBhwb(348 8% 14%)
OKLCHoklch(57.1% 0.222 20.1)
CMYK (simples, sem perfil ICC)cmyk(0%, 91%, 73%, 14%)
Decimal14.423.100
Família de matizVermelhos

Contraste e acessibilidade

Sobre crimson, texto branco tem contraste de 4,98:1 e passa no AA para texto normal; texto preto fica em 4,20:1.

Razões de contraste do WCAG 2.2 (critérios 1.4.3 e 1.4.6: AA exige 4,5:1 para texto normal e 3:1 para texto grande; AAA exige 7:1 e 4,5:1). APCA Lc é o contraste de luminosidade do modelo APCA-W3 0.0.98G proposto para o WCAG 3; quanto maior o valor absoluto, mais legível, e Lc 75 é o mínimo sugerido para texto corrido.

Contraste e acessibilidade
CombinaçãoRazãoAAAA grandeAAAAAA grandeAPCA Lc
Texto preto sobre crimson4,20:1FalhaPassaFalhaFalha31,9
Texto branco sobre crimson4,98:1PassaPassaFalhaPassa−77,6
Texto crimson sobre branco4,98:1PassaPassaFalhaPassa72,2
Texto crimson sobre preto4,20:1FalhaPassaFalhaFalha−29,5

Tons claros e escuros

Cada passo mistura crimson com branco (tons claros) ou preto (tons escuros) em sRGB com correção gama, o mesmo resultado de color-mix(in srgb, crimson, white 25%) no CSS.

Tons claros (misturados com branco)

  1. 5%
    #de2046
  2. 15%
    #e13759
  3. 25%
    #e54f6d
  4. 35%
    #e86680
  5. 45%
    #ec7e94
  6. 55%
    #ef95a7
  7. 65%
    #f3adbb
  8. 75%
    #f6c4ce
  9. 85%
    #fadce2
  10. 95%
    #fdf3f5

Tons escuros (misturados com preto)

  1. 5%
    #d11339
  2. 15%
    #bb1133
  3. 25%
    #a50f2d
  4. 35%
    #8f0d27
  5. 45%
    #790b21
  6. 55%
    #63091b
  7. 65%
    #4d0715
  8. 75%
    #37050f
  9. 85%
    #210309
  10. 95%
    #0b0103

Harmonias de cor

Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de crimson é #008B93 (perto de darkcyan), as análogas são #CE1F89 e #C44E00 e a tríade se completa com #009300 e #126DF7. Para texto por cima, branco dá mais contraste.

Harmonias de cor
HarmoniaRotaçãoCor
Complementar+180°#008b93
Análogas−30°, +30°#ce1f89#c44e00
Tríade+120°, +240°#009300#126df7
Complementar dividida+150°, +210°#00906b#0084b8

Calculadas em OKLCH: o matiz gira 180° (complementar), ±30° (análogas), ±120° (tríade) e 180° ±30° (complementar dividida), com luminosidade e croma mantidos. Quando o resultado sai do sRGB, ele é trazido de volta com o algoritmo de mapeamento de gama do CSS Color 4. Por usar OKLCH, os valores diferem das ferramentas que giram o matiz em HSL, mas as cores ficam com a mesma luminosidade percebida.

Quente ou fria?

Crimson é uma cor quente: o matiz fica em 348° no círculo HSL, na faixa dos vermelhos, laranjas e amarelos (de 0° a cerca de 70°, mais os vermelhos acima de 330°) que por convenção se chama de quente.

Cores nomeadas e do Tailwind mais próximas

A distância é o ΔE OK, a distância euclidiana no OKLab multiplicada por 100. Valores abaixo de cerca de 2 são difíceis de distinguir lado a lado.

Cores nomeadas do CSS mais próximas

Cores nomeadas do CSS mais próximas
CorHEXΔE OK
red#ff00007,7
firebrick#b222228,9
indianred#cd5c5c9,0

Cores do Tailwind v4 mais próximas

Cores do Tailwind v4 mais próximas
CorHEXΔE OK
rose-600#ec003f3,6
red-600#e7000b3,8
rose-700#c700365,8

Código

CSS
.element {
  color: crimson;
  background-color: #dc143c;
  border-color: rgb(220 20 60);
  outline-color: oklch(57.1% 0.222 20.1);
}
Tailwind CSS
<div class="bg-[#dc143c] text-white">...</div>

/* ou registre uma vez no seu CSS (Tailwind v4) */
@theme {
  --color-crimson: #dc143c;
}
/* depois use bg-crimson, text-crimson, border-crimson */
SwiftUI
import SwiftUI

extension Color {
  static let crimson = Color(red: 0.863, green: 0.078, blue: 0.235)
}
Jetpack Compose
import androidx.compose.ui.graphics.Color

val Crimson = Color(0xFFDC143C)
Flutter
import 'package:flutter/material.dart';

const crimson = Color(0xFFDC143C);
Android XML
<!-- res/values/colors.xml -->
<color name="crimson">#DC143C</color>

Perguntas frequentes

Qual é o código hex da cor crimson?
O código hex de crimson é #DC143C. A mesma cor se escreve rgb(220, 20, 60), hsl(348, 83%, 47%) ou oklch(57.1% 0.222 20.1), e no CSS também dá para usar direto a palavra-chave crimson.
Crimson é uma cor quente ou fria?
Crimson é uma cor quente: o matiz fica em 348° no círculo HSL, na faixa dos vermelhos, laranjas e amarelos (de 0° a cerca de 70°, mais os vermelhos acima de 330°) que por convenção se chama de quente.
Quais cores combinam com crimson?
Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de crimson é #008B93 (perto de darkcyan), as análogas são #CE1F89 e #C44E00 e a tríade se completa com #009300 e #126DF7. Para texto por cima, branco dá mais contraste.
Dá para usar texto branco sobre crimson?
Texto branco sobre crimson tem contraste de 4,98:1 e passa no AA para texto normal, mas não no AAA do WCAG 2.2. Texto preto chega a 4,20:1 e passa no AA só para texto grande (a partir de 24 px, ou 18,66 px em negrito). No APCA, o valor é Lc −77,6 para branco e Lc 31,9 para preto.
Qual é o RGB de crimson?
Crimson é rgb(220, 20, 60): vermelho 220, verde 20 e azul 60 na escala de 0 a 255, ou 86,3%, 7,8% e 23,5%. Em número decimal, 14423100.

Revisado em por Arielton Oberek.