Adlandırılmış renk · #F6BB00
Decor Yellow
Decor Yellow, #F6BB00: rgb(246 187 0), hsl(46 100% 48%), oklch(0.823 0.169 85.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Decor Yellow color name →
#F6BB00
oklch(0.823 0.169 85.5)
Renk dönüşümleri
- HEX
- #f6bb00
- RGB
- rgb(246 187 0)
- HSL
- hsl(46 100% 48%)
- HWB
- hwb(46 0% 4%)
- OKLCH
- oklch(0.823 0.169 85.5)
- OKLab
- oklab(0.823 0.013 0.168)
- CIE Lab
- lab(79.69 12.81 81)
- LCH
- lch(79.69 82.01 81)
- CMYK
- cmyk(0% 24% 100% 4%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F7C240
- F8CA5E
- F9D177
- FAD88D
- FBDEA1
- FCE5B5
- FDECC8
- FEF2DA
- FEF9ED
Koyu tonlar
- D6A200
- B78A00
- 987300
- 7B5C00
- 5F4600
- 453200
- 2C1F00
- 150D00
- 030200
Gri tonlar
- EAB52E
- DEB042
- D2AA4F
- C6A45A
- BA9E63
- AE986A
- A29271
- 978C77
- 8B867C
Renk uyumları
Tamamlayıcı +180°
- F6BB00
Decor Yellow
- AAC5FF
≈ Night Snow
Analog -30° +30°
- F6BB00
Decor Yellow
- FFB17A
≈ Cantaloupe Slice
- C1D13A
≈ Grunervetliner
Üçlü +120° +240°
- F6BB00
Decor Yellow
- 00DEF1
≈ Tamarama
- FB9DFF
≈ Pinkalicious
Bölünmüş tamamlayıcı +150° +210°
- F6BB00
Decor Yellow
- 7FD0FF
≈ Drift on the Sea
- CAB8FF
≈ Violet Heaven
Dörtlü +90° +180° +270°
- F6BB00
Decor Yellow
- 00E5C0
≈ Aquamarine
- AAC5FF
≈ Night Snow
- FFA7C8
≈ Taffy Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.74:1 · APCA Lc 32
Ag
AAASiyah üzerinde
WCAG 12.02:1 · APCA Lc 71
En iyi metin rengi: #000000
WCAG 12.02:1 (AAA) · APCA Lc 71
Contrast pairs
Kod parçacıkları
CSS
:root {
--decor-yellow: #f6bb00;
--decor-yellow-rgb: 246 187 0;
--decor-yellow-oklch: oklch(0.823 0.169 85.5);
}
.element {
color: var(--decor-yellow);
background-color: hsl(46 100% 48%);
border-color: oklch(0.823 0.169 85.5);
}Tailwind CSS v4
@theme {
--color-decor-yellow: #f6bb00;
--color-decor-yellow-50: #fff3be;
--color-decor-yellow-100: #ffe5a7;
--color-decor-yellow-200: #f3d07d;
--color-decor-yellow-300: #dcb142;
--color-decor-yellow-400: #cb9400;
--color-decor-yellow-500: #b77900;
--color-decor-yellow-600: #9b6600;
--color-decor-yellow-700: #7c5200;
--color-decor-yellow-800: #5e3b00;
--color-decor-yellow-900: #422800;
--color-decor-yellow-950: #2a1600;
}SCSS
$decor-yellow: #f6bb00;
$decor-yellow-rgb: 246, 187, 0;
$decor-yellow-light: mix(#fff, $decor-yellow, 20%);
$decor-yellow-dark: mix(#000, $decor-yellow, 20%);
.element {
color: $decor-yellow;
box-shadow: 0 0 0 2px rgba($decor-yellow, 0.35);
}