Adlandırılmış renk · #D98B51
Toffee Cream
Toffee Cream, #D98B51: rgb(217 139 81), hsl(26 64% 58%), oklch(0.706 0.121 55.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Toffee Cream color name →
#D98B51
oklch(0.706 0.121 55.9)
Renk dönüşümleri
- HEX
- #d98b51
- RGB
- rgb(217 139 81)
- HSL
- hsl(26 64% 58%)
- HWB
- hwb(26 32% 15%)
- OKLCH
- oklch(0.706 0.121 55.9)
- OKLab
- oklab(0.706 0.068 0.1)
- CIE Lab
- lab(65.31 26.64 43.42)
- LCH
- lch(65.31 50.94 58.5)
- CMYK
- cmyk(0% 36% 63% 15%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- DE9764
- E2A276
- E6AE87
- EBBA98
- EEC5A9
- F2D1BA
- F6DCCB
- F9E8DD
- FCF3EE
Koyu tonlar
- BC7845
- A1663A
- 86542F
- 6C4324
- 53321A
- 3B2310
- 251407
- 110702
- 020100
Gri tonlar
- D08A58
- C88A5D
- BF8963
- B68868
- AD876C
- A48671
- 9B8475
- 928379
- 89827D
Renk uyumları
Tamamlayıcı +180°
- D98B51
Toffee Cream
- 48ABE1
≈ Thalassophile
Analog -30° +30°
- D98B51
Toffee Cream
- E18178
≈ Tango Pink
- C29A3B
≈ Golden Mean
Üçlü +120° +240°
- D98B51
Toffee Cream
- 2FB89D
≈ Capture
- A790E3
≈ Middy’s Purple
Bölünmüş tamamlayıcı +150° +210°
- D98B51
Toffee Cream
- 01B5C5
≈ Lago Blue
- 7D9EEC
≈ Portage
Dörtlü +90° +180° +270°
- D98B51
Toffee Cream
- 6CB471
≈ Appleton
- 48ABE1
≈ Thalassophile
- C785C9
≈ Purception
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.70:1 · APCA Lc 52
Ag
AAASiyah üzerinde
WCAG 7.76:1 · APCA Lc 50
En iyi metin rengi: #000000
WCAG 7.76:1 (AAA) · APCA Lc 50
Contrast pairs
Kod parçacıkları
CSS
:root {
--toffee-cream: #d98b51;
--toffee-cream-rgb: 217 139 81;
--toffee-cream-oklch: oklch(0.706 0.121 55.9);
}
.element {
color: var(--toffee-cream);
background-color: hsl(26 64% 58%);
border-color: oklch(0.706 0.121 55.9);
}Tailwind CSS v4
@theme {
--color-toffee-cream: #d98b51;
--color-toffee-cream-50: #ffedd4;
--color-toffee-cream-100: #ffdfc1;
--color-toffee-cream-200: #fcc8a2;
--color-toffee-cream-300: #e6a879;
--color-toffee-cream-400: #d58b54;
--color-toffee-cream-500: #c16e29;
--color-toffee-cream-600: #a35d25;
--color-toffee-cream-700: #834b1d;
--color-toffee-cream-800: #623514;
--color-toffee-cream-900: #45240d;
--color-toffee-cream-950: #2c1302;
}SCSS
$toffee-cream: #d98b51;
$toffee-cream-rgb: 217, 139, 81;
$toffee-cream-light: mix(#fff, $toffee-cream, 20%);
$toffee-cream-dark: mix(#000, $toffee-cream, 20%);
.element {
color: $toffee-cream;
box-shadow: 0 0 0 2px rgba($toffee-cream, 0.35);
}