Couleur nommée · #FFB347
Agrellan Badland
Agrellan Badland correspond à #FFB347 : rgb(255 179 71), hsl(35 100% 64%), oklch(0.821 0.149 72.1). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Orange mean? → · Agrellan Badland color name →
#FFB347
oklch(0.821 0.149 72.1)
Conversions de couleur
- HEX
- #ffb347
- RGB
- rgb(255 179 71)
- HSL
- hsl(35 100% 64%)
- HWB
- hwb(35 28% 0%)
- OKLCH
- oklch(0.821 0.149 72.1)
- OKLab
- oklab(0.821 0.046 0.141)
- CIE Lab
- lab(79.01 21.72 63.96)
- LCH
- lch(79.01 67.55 71.2)
- CMYK
- cmyk(0% 30% 72% 0%)
Teintes · Ombres · Tons
Teintes
- FFBB5F
- FFC374
- FFCB88
- FFD39A
- FFDAAB
- FFE2BD
- FFE9CD
- FFF1DE
- FFF8EF
Ombres
- DE9B3D
- BE8432
- 9E6E28
- 80581F
- 634316
- 482F0D
- 2E1D06
- 160C02
- 030100
Tons
- F2AE52
- E5A95B
- D8A462
- CB9F68
- BF9A6E
- B29572
- A69076
- 998B7A
- 8C857D
Harmonies de couleurs
Complémentaire +180°
- FFB347
Agrellan Badland
- 99C9FF
≈ Apocyan
Analogue -30° +30°
- FFB347
Agrellan Badland
- FFAE8E
≈ Coral Correlation
- D8C743
≈ Green Sheen
Triadique +120° +240°
- FFB347
Agrellan Badland
- 00E1DC
≈ Fish Boy
- E0ACFF
≈ Testosterose
Complémentaire divisée +150° +210°
- FFB347
Agrellan Badland
- 52D6FF
≈ Libra Blue Morpho
- BABEFF
≈ Dried Lilac
Tétradique +90° +180° +270°
- FFB347
Agrellan Badland
- 55E2A7
≈ Medium Aquamarine
- 99C9FF
≈ Apocyan
- FFA1DC
≈ Rose Daphne
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.78:1 · APCA Lc 33
Ag
AAASur noir
WCAG 11.79:1 · APCA Lc 70
Meilleure couleur de texte: #000000
WCAG 11.79:1 (AAA) · APCA Lc 70
Contrast pairs
Extraits de code
CSS
:root {
--agrellan-badland: #ffb347;
--agrellan-badland-rgb: 255 179 71;
--agrellan-badland-oklch: oklch(0.821 0.149 72.1);
}
.element {
color: var(--agrellan-badland);
background-color: hsl(35 100% 64%);
border-color: oklch(0.821 0.149 72.1);
}Tailwind CSS v4
@theme {
--color-agrellan-badland: #ffb347;
--color-agrellan-badland-50: #fff0c7;
--color-agrellan-badland-100: #ffe1b1;
--color-agrellan-badland-200: #fbcb8c;
--color-agrellan-badland-300: #e5ab5a;
--color-agrellan-badland-400: #d48e20;
--color-agrellan-badland-500: #c07100;
--color-agrellan-badland-600: #a36000;
--color-agrellan-badland-700: #834d00;
--color-agrellan-badland-800: #623700;
--color-agrellan-badland-900: #452500;
--color-agrellan-badland-950: #2c1400;
}SCSS
$agrellan-badland: #ffb347;
$agrellan-badland-rgb: 255, 179, 71;
$agrellan-badland-light: mix(#fff, $agrellan-badland, 20%);
$agrellan-badland-dark: mix(#000, $agrellan-badland, 20%);
.element {
color: $agrellan-badland;
box-shadow: 0 0 0 2px rgba($agrellan-badland, 0.35);
}