Màu có tên · #FFFBB0
Creamy Sunshine Pastel
Creamy Sunshine Pastel là #FFFBB0: rgb(255 251 176), hsl(57 100% 85%), oklch(0.974 0.094 105.4). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Yellow mean? → · Creamy Sunshine Pastel color name →
#FFFBB0
oklch(0.974 0.094 105.4)
Chuyển đổi màu
- HEX
- #fffbb0
- RGB
- rgb(255 251 176)
- HSL
- hsl(57 100% 85%)
- HWB
- hwb(57 69% 0%)
- OKLCH
- oklch(0.974 0.094 105.4)
- OKLab
- oklab(0.974 -0.025 0.091)
- CIE Lab
- lab(97.65 -6.77 36.56)
- LCH
- lch(97.65 37.18 100.5)
- CMYK
- cmyk(0% 2% 31% 0%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- FFFCB9
- FFFCC1
- FFFDC9
- FFFDD1
- FFFDD9
- FFFEE1
- FFFEE8
- FFFEF0
- FFFFF8
Sắc đậm
- DEDA99
- BEBA82
- 9E9C6C
- 807E56
- 636142
- 48462E
- 2E2D1C
- 16150B
- 030301
Sắc xám
- F2EEAC
- E4E1A7
- D7D5A3
- CAC89E
- BDBC99
- B1B094
- A4A48F
- 98988A
- 8C8C85
Hòa sắc
Bổ túc +180°
- FFFBB0
Creamy Sunshine Pastel
- F5F5FF
≈ Sugar Crystal
Tương đồng -30° +30°
- FFFBB0
Creamy Sunshine Pastel
- FFF5E7
≈ Soft Pillow
- E8FFDD
≈ Nyanza
Bộ ba +120° +240°
- FFFBB0
Creamy Sunshine Pastel
- ECF9FF
≈ Alice Blue
- FFF2F9
≈ Pinkish White
Bổ túc chia +150° +210°
- FFFBB0
Creamy Sunshine Pastel
- F1F7FF
≈ Alice Blue
- FBF3FF
≈ Sugar Crystal
Bộ bốn +90° +180° +270°
- FFFBB0
Creamy Sunshine Pastel
- DBFFFE
≈ Cold Canada
- F5F5FF
≈ Sugar Crystal
- FFF3F4
≈ Glimpse of Pink
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.06:1 · APCA Lc 0
Ag
AAATrên nền đen
WCAG 19.67:1 · APCA Lc 103
Màu chữ tốt nhất: #000000
WCAG 19.67:1 (AAA) · APCA Lc 103
Contrast pairs
Đoạn mã
CSS
:root {
--creamy-sunshine-pastel: #fffbb0;
--creamy-sunshine-pastel-rgb: 255 251 176;
--creamy-sunshine-pastel-oklch: oklch(0.974 0.094 105.4);
}
.element {
color: var(--creamy-sunshine-pastel);
background-color: hsl(57 100% 85%);
border-color: oklch(0.974 0.094 105.4);
}Tailwind CSS v4
@theme {
--color-creamy-sunshine-pastel: #fffbb0;
--color-creamy-sunshine-pastel-50: #f7f8d9;
--color-creamy-sunshine-pastel-100: #ebebc7;
--color-creamy-sunshine-pastel-200: #d8d8a9;
--color-creamy-sunshine-pastel-300: #bcbb83;
--color-creamy-sunshine-pastel-400: #a6a25e;
--color-creamy-sunshine-pastel-500: #8f8a38;
--color-creamy-sunshine-pastel-600: #797431;
--color-creamy-sunshine-pastel-700: #615d26;
--color-creamy-sunshine-pastel-800: #484419;
--color-creamy-sunshine-pastel-900: #322f10;
--color-creamy-sunshine-pastel-950: #1e1b04;
}SCSS
$creamy-sunshine-pastel: #fffbb0;
$creamy-sunshine-pastel-rgb: 255, 251, 176;
$creamy-sunshine-pastel-light: mix(#fff, $creamy-sunshine-pastel, 20%);
$creamy-sunshine-pastel-dark: mix(#000, $creamy-sunshine-pastel, 20%);
.element {
color: $creamy-sunshine-pastel;
box-shadow: 0 0 0 2px rgba($creamy-sunshine-pastel, 0.35);
}