Màu có tên · #B6C7E3
Beautiful Dream
Beautiful Dream là #B6C7E3: rgb(182 199 227), hsl(217 45% 80%), oklch(0.826 0.044 260.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 Blue mean? → · Beautiful Dream color name →
#B6C7E3
oklch(0.826 0.044 260.4)
Chuyển đổi màu
- HEX
- #b6c7e3
- RGB
- rgb(182 199 227)
- HSL
- hsl(217 45% 80%)
- HWB
- hwb(217 71% 11%)
- OKLCH
- oklch(0.826 0.044 260.4)
- OKLab
- oklab(0.826 -0.007 -0.043)
- CIE Lab
- lab(79.62 -1.59 -16.03)
- LCH
- lch(79.62 16.11 264.3)
- CMYK
- cmyk(20% 12% 0% 11%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- BDCDE6
- C4D2E9
- CCD8EC
- D3DDEE
- DAE3F1
- E1E8F4
- E9EEF7
- F0F4FA
- F8F9FC
Sắc đậm
- 9EADC5
- 8693A8
- 6F7A8C
- 596271
- 444C57
- 30363F
- 1D2127
- 0C0E12
- 020203
Sắc xám
- B0C0D9
- ABB8CF
- A6B1C4
- A0AABA
- 9BA3B0
- 959CA7
- 90959D
- 8B8E93
- 85878A
Hòa sắc
Bổ túc +180°
- B6C7E3
Beautiful Dream
- D5C4A7
≈ Stalactite Brown
Tương đồng -30° +30°
- B6C7E3
Beautiful Dream
- AACCDD
≈ Carefree Sky
- C5C2E1
≈ Party Hat
Bộ ba +120° +240°
- B6C7E3
Beautiful Dream
- E1BBBA
≈ Soft Blush
- B7CDB3
≈ Succulent Garden
Bổ túc chia +150° +210°
- B6C7E3
Beautiful Dream
- DEBFAD
≈ Cinnamon Tea
- C7C9A9
≈ Jardin de Hierbas
Bộ bốn +90° +180° +270°
- B6C7E3
Beautiful Dream
- DDBBCA
≈ Smoked Silver
- D5C4A7
≈ Stalactite Brown
- ABD0C2
≈ Swimming Pool Green
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.71:1 · APCA Lc 31
Ag
AAATrên nền đen
WCAG 12.26:1 · APCA Lc 72
Màu chữ tốt nhất: #000000
WCAG 12.26:1 (AAA) · APCA Lc 72
Contrast pairs
Đoạn mã
CSS
:root {
--beautiful-dream: #b6c7e3;
--beautiful-dream-rgb: 182 199 227;
--beautiful-dream-oklch: oklch(0.826 0.044 260.4);
}
.element {
color: var(--beautiful-dream);
background-color: hsl(217 45% 80%);
border-color: oklch(0.826 0.044 260.4);
}Tailwind CSS v4
@theme {
--color-beautiful-dream: #b6c7e3;
--color-beautiful-dream-50: #eef5ff;
--color-beautiful-dream-100: #e0e8f7;
--color-beautiful-dream-200: #cad5e8;
--color-beautiful-dream-300: #acb8ce;
--color-beautiful-dream-400: #909fb9;
--color-beautiful-dream-500: #7687a4;
--color-beautiful-dream-600: #64728a;
--color-beautiful-dream-700: #505b6f;
--color-beautiful-dream-800: #394352;
--color-beautiful-dream-900: #272e39;
--color-beautiful-dream-950: #151b23;
}SCSS
$beautiful-dream: #b6c7e3;
$beautiful-dream-rgb: 182, 199, 227;
$beautiful-dream-light: mix(#fff, $beautiful-dream, 20%);
$beautiful-dream-dark: mix(#000, $beautiful-dream, 20%);
.element {
color: $beautiful-dream;
box-shadow: 0 0 0 2px rgba($beautiful-dream, 0.35);
}