Cor nomeada · #FFBB80
Apricot Flower
Apricot Flower é #FFBB80: rgb(255 187 128), hsl(28 100% 75%), oklch(0.842 0.109 61.5). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Apricot Flower color name →
#FFBB80
oklch(0.842 0.109 61.5)
Conversões de cor
- HEX
- #ffbb80
- RGB
- rgb(255 187 128)
- HSL
- hsl(28 100% 75%)
- HWB
- hwb(28 50% 0%)
- OKLCH
- oklch(0.842 0.109 61.5)
- OKLab
- oklab(0.842 0.052 0.096)
- CIE Lab
- lab(81.39 20.48 39.91)
- LCH
- lch(81.39 44.86 62.8)
- CMYK
- cmyk(0% 27% 50% 0%)
Tons claros · Sombras · Tons
Tons claros
- FFC28D
- FFC99B
- FFD0A7
- FFD7B4
- FFDEC1
- FFE4CD
- FFEBDA
- FFF2E6
- FFF8F3
Sombras
- DEA26E
- BE8A5D
- 9E734D
- 805C3D
- 63462E
- 48321F
- 2E1F12
- 160D06
- 030201
Tons
- F2B581
- E5AF82
- D8AA82
- CBA482
- BF9E83
- B29882
- A59282
- 998C82
- 8C8681
Harmonias de cor
Complementar +180°
- FFBB80
Apricot Flower
- 98D3FF
≈ Long Island Sound
Análoga -30° +30°
- FFBB80
Apricot Flower
- FFB7A8
≈ Nature Apricot
- E5C975
≈ Sand
Tríade +120° +240°
- FFBB80
Apricot Flower
- 70E3D0
≈ Turquoise Chalk
- D6BDFF
≈ Lavender Fragrance
Complementar dividida +150° +210°
- FFBB80
Apricot Flower
- 6ADEF4
≈ Electric Lemonade
- B9C9FF
≈ Light Periwinkle
Tétrade +90° +180° +270°
- FFBB80
Apricot Flower
- 95E0A8
≈ Dead 99
- 98D3FF
≈ Long Island Sound
- F5B1EC
≈ Pink Apotheosis
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.65:1 · APCA Lc 29
Ag
AAASobre preto
WCAG 12.67:1 · APCA Lc 74
Melhor cor de texto: #000000
WCAG 12.67:1 (AAA) · APCA Lc 74
Contrast pairs
Trechos de código
CSS
:root {
--apricot-flower: #ffbb80;
--apricot-flower-rgb: 255 187 128;
--apricot-flower-oklch: oklch(0.842 0.109 61.5);
}
.element {
color: var(--apricot-flower);
background-color: hsl(28 100% 75%);
border-color: oklch(0.842 0.109 61.5);
}Tailwind CSS v4
@theme {
--color-apricot-flower: #ffbb80;
--color-apricot-flower-50: #ffefd6;
--color-apricot-flower-100: #ffe1c3;
--color-apricot-flower-200: #f6cba4;
--color-apricot-flower-300: #dfac7c;
--color-apricot-flower-400: #cd8f58;
--color-apricot-flower-500: #b9742f;
--color-apricot-flower-600: #9c622a;
--color-apricot-flower-700: #7d4e21;
--color-apricot-flower-800: #5e3817;
--color-apricot-flower-900: #42270f;
--color-apricot-flower-950: #2a1503;
}SCSS
$apricot-flower: #ffbb80;
$apricot-flower-rgb: 255, 187, 128;
$apricot-flower-light: mix(#fff, $apricot-flower, 20%);
$apricot-flower-dark: mix(#000, $apricot-flower, 20%);
.element {
color: $apricot-flower;
box-shadow: 0 0 0 2px rgba($apricot-flower, 0.35);
}