Cor nomeada · #FFE690
Swallowtail
Swallowtail é #FFE690: rgb(255 230 144), hsl(46 100% 78%), oklch(0.927 0.109 93.7). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Swallowtail color name →
#FFE690
oklch(0.927 0.109 93.7)
Conversões de cor
- HEX
- #ffe690
- RGB
- rgb(255 230 144)
- HSL
- hsl(46 100% 78%)
- HWB
- hwb(46 56% 0%)
- OKLCH
- oklch(0.927 0.109 93.7)
- OKLab
- oklab(0.927 -0.007 0.109)
- CIE Lab
- lab(91.98 0.57 45.05)
- LCH
- lch(91.98 45.05 89.3)
- CMYK
- cmyk(0% 10% 44% 0%)
Tons claros · Sombras · Tons
Tons claros
- FFE99C
- FFEBA8
- FFEEB4
- FFF1BF
- FFF3CA
- FFF6D5
- FFF8E0
- FFFAEA
- FFFDF5
Sombras
- DEC87D
- BEAB6A
- 9E8E57
- 807345
- 635934
- 484024
- 2E2815
- 161307
- 030301
Tons
- F2DB90
- E4D18F
- D7C78E
- CABC8C
- BDB28B
- B1A889
- A49E87
- 989485
- 8C8A83
Harmonias de cor
Complementar +180°
- FFE690
Swallowtail
- DFE6FF
≈ Lavender Mist
Análoga -30° +30°
- FFE690
Swallowtail
- FFE1C6
≈ Wild Maple
- D8F4A2
≈ Creamy Avocado
Tríade +120° +240°
- FFE690
Swallowtail
- BAF2FF
≈ Northrend
- FFDAF7
≈ Strawberry Frost
Complementar dividida +150° +210°
- FFE690
Swallowtail
- D2EAFF
≈ Veiling Waterfalls
- EDE0FF
≈ Lavender Savour
Tétrade +90° +180° +270°
- FFE690
Swallowtail
- 8BFFEF
≈ Defence Matrix
- DFE6FF
≈ Lavender Mist
- FFDDE4
≈ Fresh Piglet
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.23:1 · APCA Lc 12
Ag
AAASobre preto
WCAG 16.97:1 · APCA Lc 92
Melhor cor de texto: #000000
WCAG 16.97:1 (AAA) · APCA Lc 92
Contrast pairs
Trechos de código
CSS
:root {
--swallowtail: #ffe690;
--swallowtail-rgb: 255 230 144;
--swallowtail-oklch: oklch(0.927 0.109 93.7);
}
.element {
color: var(--swallowtail);
background-color: hsl(46 100% 78%);
border-color: oklch(0.927 0.109 93.7);
}Tailwind CSS v4
@theme {
--color-swallowtail: #ffe690;
--color-swallowtail-50: #fef6d3;
--color-swallowtail-100: #f3e8bf;
--color-swallowtail-200: #e2d59f;
--color-swallowtail-300: #c8b876;
--color-swallowtail-400: #b49d4d;
--color-swallowtail-500: #9e8418;
--color-swallowtail-600: #867019;
--color-swallowtail-700: #6b5914;
--color-swallowtail-800: #50410b;
--color-swallowtail-900: #382d07;
--color-swallowtail-950: #221900;
}SCSS
$swallowtail: #ffe690;
$swallowtail-rgb: 255, 230, 144;
$swallowtail-light: mix(#fff, $swallowtail, 20%);
$swallowtail-dark: mix(#000, $swallowtail, 20%);
.element {
color: $swallowtail;
box-shadow: 0 0 0 2px rgba($swallowtail, 0.35);
}