Color con nombre · #FFB75F
Peanut Butter Chicken
Peanut Butter Chicken es #FFB75F: rgb(255 183 95), hsl(33 100% 69%), oklch(0.83 0.133 69.6). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Orange mean? → · Peanut Butter Chicken color name →
#FFB75F
oklch(0.83 0.133 69.6)
Conversiones de color
- HEX
- #ffb75f
- RGB
- rgb(255 183 95)
- HSL
- hsl(33 100% 69%)
- HWB
- hwb(33 37% 0%)
- OKLCH
- oklch(0.83 0.133 69.6)
- OKLab
- oklab(0.83 0.047 0.125)
- CIE Lab
- lab(80.12 20.66 54.57)
- LCH
- lch(80.12 58.35 69.3)
- CMYK
- cmyk(0% 28% 63% 0%)
Tintes · Sombras · Tonos
Tintes
- FFBF72
- FFC683
- FFCD94
- FFD5A4
- FFDCB3
- FFE3C3
- FFEAD2
- FFF1E1
- FFF8F0
Sombras
- DE9F52
- BE8744
- 9E7038
- 805A2C
- 634520
- 483115
- 2E1E0A
- 160C03
- 030200
Tonos
- F2B265
- E5AC6A
- D8A76E
- CBA272
- BF9C76
- B29778
- A5917B
- 998B7D
- 8C867F
Armonías de color
Complementario +180°
- FFB75F
Peanut Butter Chicken
- 9BCDFF
≈ Apocyan
Análogo -30° +30°
- FFB75F
Peanut Butter Chicken
- FFB298
≈ Prairie Sunset
- DCC959
≈ Duck Butter
Triádico +120° +240°
- FFB75F
Peanut Butter Chicken
- 37E3DA
≈ Fresh Turquoise
- DEB3FF
≈ Mauve
Complementario dividido +150° +210°
- FFB75F
Peanut Butter Chicken
- 55DAFF
≈ Ionized-Air Glow
- BCC2FF
≈ Light Periwinkle
Tetrádico +90° +180° +270°
- FFB75F
Peanut Butter Chicken
- 70E2A9
≈ Medium Aquamarine
- 9BCDFF
≈ Apocyan
- FFA6E2
≈ Corinthian Pink
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.72:1 · APCA Lc 31
Ag
AAASobre negro
WCAG 12.19:1 · APCA Lc 72
Mejor color de texto: #000000
WCAG 12.19:1 (AAA) · APCA Lc 72
Contrast pairs
Fragmentos de código
CSS
:root {
--peanut-butter-chicken: #ffb75f;
--peanut-butter-chicken-rgb: 255 183 95;
--peanut-butter-chicken-oklch: oklch(0.83 0.133 69.6);
}
.element {
color: var(--peanut-butter-chicken);
background-color: hsl(33 100% 69%);
border-color: oklch(0.83 0.133 69.6);
}Tailwind CSS v4
@theme {
--color-peanut-butter-chicken: #ffb75f;
--color-peanut-butter-chicken-50: #fff0cc;
--color-peanut-butter-chicken-100: #ffe1b8;
--color-peanut-butter-chicken-200: #f8cb95;
--color-peanut-butter-chicken-300: #e2ac68;
--color-peanut-butter-chicken-400: #d18f3a;
--color-peanut-butter-chicken-500: #bd7300;
--color-peanut-butter-chicken-600: #a06100;
--color-peanut-butter-chicken-700: #804e00;
--color-peanut-butter-chicken-800: #603800;
--color-peanut-butter-chicken-900: #432600;
--color-peanut-butter-chicken-950: #2b1400;
}SCSS
$peanut-butter-chicken: #ffb75f;
$peanut-butter-chicken-rgb: 255, 183, 95;
$peanut-butter-chicken-light: mix(#fff, $peanut-butter-chicken, 20%);
$peanut-butter-chicken-dark: mix(#000, $peanut-butter-chicken, 20%);
.element {
color: $peanut-butter-chicken;
box-shadow: 0 0 0 2px rgba($peanut-butter-chicken, 0.35);
}