Couleur nommée · #FFB355
Cantaloupe Smile
Cantaloupe Smile correspond à #FFB355 : rgb(255 179 85), hsl(33 100% 67%), oklch(0.822 0.14 69.3). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Orange mean? → · Cantaloupe Smile color name →
#FFB355
oklch(0.822 0.14 69.3)
Conversions de couleur
- HEX
- #ffb355
- RGB
- rgb(255 179 85)
- HSL
- hsl(33 100% 67%)
- HWB
- hwb(33 33% 0%)
- OKLCH
- oklch(0.822 0.14 69.3)
- OKLab
- oklab(0.822 0.05 0.131)
- CIE Lab
- lab(79.11 22.22 58.06)
- LCH
- lch(79.11 62.17 69.1)
- CMYK
- cmyk(0% 30% 67% 0%)
Teintes · Ombres · Tons
Teintes
- FFBB6A
- FFC37D
- FFCB8E
- FFD29F
- FFDAB0
- FFE2C0
- FFE9D0
- FFF0E0
- FFF8EF
Ombres
- DE9B49
- BE843D
- 9E6E31
- 805826
- 63431C
- 482F11
- 2E1D08
- 160C02
- 030100
Tons
- F2AE5D
- E5A963
- D8A469
- CB9F6E
- BF9A72
- B29576
- A69079
- 998B7C
- 8D857E
Harmonies de couleurs
Complémentaire +180°
- FFB355
Cantaloupe Smile
- 96CAFF
≈ Apocyan
Analogue -30° +30°
- FFB355
Cantaloupe Smile
- FFAE93
≈ Peach Nectar
- DBC64D
≈ Yellow Magic Orchestra
Triadique +120° +240°
- FFB355
Cantaloupe Smile
- 16E1D8
≈ Fresh Turquoise
- DCAFFF
≈ Mauve
Complémentaire divisée +150° +210°
- FFB355
Cantaloupe Smile
- 43D8FF
≈ Libra Blue Morpho
- B8BFFF
≈ Dried Lilac
Tétradique +90° +180° +270°
- FFB355
Cantaloupe Smile
- 67E0A4
≈ Medium Aquamarine
- 96CAFF
≈ Apocyan
- FFA1E2
≈ Lavender Rose
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.77:1 · APCA Lc 32
Ag
AAASur noir
WCAG 11.83:1 · APCA Lc 70
Meilleure couleur de texte: #000000
WCAG 11.83:1 (AAA) · APCA Lc 70
Contrast pairs
Extraits de code
CSS
:root {
--cantaloupe-smile: #ffb355;
--cantaloupe-smile-rgb: 255 179 85;
--cantaloupe-smile-oklch: oklch(0.822 0.14 69.3);
}
.element {
color: var(--cantaloupe-smile);
background-color: hsl(33 100% 67%);
border-color: oklch(0.822 0.14 69.3);
}Tailwind CSS v4
@theme {
--color-cantaloupe-smile: #ffb355;
--color-cantaloupe-smile-50: #ffefca;
--color-cantaloupe-smile-100: #ffe1b5;
--color-cantaloupe-smile-200: #facb91;
--color-cantaloupe-smile-300: #e4ab63;
--color-cantaloupe-smile-400: #d38e32;
--color-cantaloupe-smile-500: #c07100;
--color-cantaloupe-smile-600: #a26000;
--color-cantaloupe-smile-700: #824d00;
--color-cantaloupe-smile-800: #623700;
--color-cantaloupe-smile-900: #442500;
--color-cantaloupe-smile-950: #2c1400;
}SCSS
$cantaloupe-smile: #ffb355;
$cantaloupe-smile-rgb: 255, 179, 85;
$cantaloupe-smile-light: mix(#fff, $cantaloupe-smile, 20%);
$cantaloupe-smile-dark: mix(#000, $cantaloupe-smile, 20%);
.element {
color: $cantaloupe-smile;
box-shadow: 0 0 0 2px rgba($cantaloupe-smile, 0.35);
}