Skip to content

Cor nomeada do CSS

Cor Bisque #FFE4C4

Bisque (palavra-chave bisque no CSS) tem o código hex #FFE4C4 e o valor RGB rgb(255, 228, 196): um off-white com tom bege.

Bisque#FFE4C4

Biscoito (bisque) é o termo da cerâmica para a argila queimada uma vez e ainda sem esmalte, e a cor imita esse tom creme alaranjado. É um dos nomes do X11 adotados pelo SVG e depois pelo CSS.

Códigos da cor Bisque

Códigos da cor Bisque
Palavra-chave CSSbisque
HEX#FFE4C4
RGBrgb(255, 228, 196)
HSLhsl(33, 100%, 88%)
HWBhwb(33 77% 0%)
OKLCHoklch(93.3% 0.051 71.8)
CMYK (simples, sem perfil ICC)cmyk(0%, 11%, 23%, 0%)
Decimal16.770.244
Família de matizMarrons e beges

Contraste e acessibilidade

Sobre bisque, texto preto tem contraste de 17,14:1 e passa no AAA para qualquer tamanho de texto; texto branco fica em 1,22: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 bisque17,14:1PassaPassaPassaPassa92,5
Texto branco sobre bisque1,22:1FalhaFalhaFalhaFalha−12,9
Texto bisque sobre branco1,22:1FalhaFalhaFalhaFalha11,1
Texto bisque sobre preto17,14:1PassaPassaPassaPassa−93,0

Tons claros e escuros

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

Tons claros (misturados com branco)

  1. 5%
    #ffe5c7
  2. 15%
    #ffe8cd
  3. 25%
    #ffebd3
  4. 35%
    #ffedd9
  5. 45%
    #fff0df
  6. 55%
    #fff3e4
  7. 65%
    #fff6ea
  8. 75%
    #fff8f0
  9. 85%
    #fffbf6
  10. 95%
    #fffefc

Tons escuros (misturados com preto)

  1. 5%
    #f2d9ba
  2. 15%
    #d9c2a7
  3. 25%
    #bfab93
  4. 35%
    #a6947f
  5. 45%
    #8c7d6c
  6. 55%
    #736758
  7. 65%
    #595045
  8. 75%
    #403931
  9. 85%
    #26221d
  10. 95%
    #0d0b0a

Harmonias de cor

Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de bisque é #D1ECFF (perto de lavender), as análogas são #FFDECF e #EFEBC4 e a tríade se completa com #C2F4F1 e #F4E0FF. Para texto por cima, preto dá mais contraste.

Harmonias de cor
HarmoniaRotaçãoCor
Complementar+180°#d1ecff
Análogas−30°, +30°#ffdecf#efebc4
Tríade+120°, +240°#c2f4f1#f4e0ff
Complementar dividida+150°, +210°#c4f1ff#e3e5ff

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?

Bisque é uma cor quente: o matiz fica em 33° 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
blanchedalmond#ffebcd1,8
moccasin#ffe4b51,9
peachpuff#ffdab92,5

Cores do Tailwind v4 mais próximas

Cores do Tailwind v4 mais próximas
CorHEXΔE OK
orange-100#ffedd42,5
amber-100#fef3c63,8
orange-200#ffd6a74,0

Código

CSS
.element {
  color: bisque;
  background-color: #ffe4c4;
  border-color: rgb(255 228 196);
  outline-color: oklch(93.3% 0.051 71.8);
}
Tailwind CSS
<div class="bg-[#ffe4c4] text-black">...</div>

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

extension Color {
  static let bisque = Color(red: 1.000, green: 0.894, blue: 0.769)
}
Jetpack Compose
import androidx.compose.ui.graphics.Color

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

const bisque = Color(0xFFFFE4C4);
Android XML
<!-- res/values/colors.xml -->
<color name="bisque">#FFE4C4</color>

Perguntas frequentes

Qual é o código hex da cor bisque?
O código hex de bisque é #FFE4C4. A mesma cor se escreve rgb(255, 228, 196), hsl(33, 100%, 88%) ou oklch(93.3% 0.051 71.8), e no CSS também dá para usar direto a palavra-chave bisque.
Bisque é uma cor quente ou fria?
Bisque é uma cor quente: o matiz fica em 33° 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 bisque?
Girando o matiz em OKLCH e mantendo luminosidade e croma, a complementar de bisque é #D1ECFF (perto de lavender), as análogas são #FFDECF e #EFEBC4 e a tríade se completa com #C2F4F1 e #F4E0FF. Para texto por cima, preto dá mais contraste.
Dá para usar texto branco sobre bisque?
Texto branco sobre bisque tem contraste de 1,22:1 e não passa no AA nem para texto grande do WCAG 2.2. Texto preto chega a 17,14:1 e passa no AA e no AAA. No APCA, o valor é Lc −12,9 para branco e Lc 92,5 para preto.
Qual é o RGB de bisque?
Bisque é rgb(255, 228, 196): vermelho 255, verde 228 e azul 196 na escala de 0 a 255, ou 100,0%, 89,4% e 76,9%. Em número decimal, 16770244.

Revisado em por Arielton Oberek.