Màu có tên gần nhất · #7ABBC3
#7ABBC3
Màu có tên gần nhất: Cuttlefish
#7ABBC3 (rgb(122 187 195), hsl(187 38% 62%), oklch(0.751 0.067 205.7)) gần nhất với màu có tên Cuttlefish. 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.
#7ABBC3
oklch(0.751 0.067 205.7)
Chuyển đổi màu
- HEX
- #7abbc3
- RGB
- rgb(122 187 195)
- HSL
- hsl(187 38% 62%)
- HWB
- hwb(187 48% 24%)
- OKLCH
- oklch(0.751 0.067 205.7)
- OKLab
- oklab(0.751 -0.06 -0.029)
- CIE Lab
- lab(71.73 -20.03 -11)
- LCH
- lch(71.73 22.85 208.8)
- CMYK
- cmyk(37% 4% 0% 24%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- 88C2C9
- 96C9CF
- A3CFD5
- B0D6DB
- BEDDE1
- CBE4E7
- D8EBED
- E5F1F3
- F2F8F9
Sắc đậm
- 69A2A9
- 598A90
- 497378
- 3A5C60
- 2B464A
- 1D3234
- 101F20
- 050D0E
- 010202
Sắc xám
- 7CB5BC
- 7DAFB5
- 7EA9AE
- 7FA3A8
- 7F9DA1
- 80979A
- 809294
- 808C8D
- 808687
Hòa sắc
Bổ túc +180°
- 7ABBC3
Cuttlefish
- D69E98
≈ Evening Dress
Tương đồng -30° +30°
- 7ABBC3
Cuttlefish
- 80BDAC
≈ Ocean Wave
- 85B6D3
≈ Harbour Sky
Bộ ba +120° +240°
- 7ABBC3
Cuttlefish
- C5A0C6
≈ Stormy Sunrise
- C2AC7D
≈ Cobbler
Bổ túc chia +150° +210°
- 7ABBC3
Cuttlefish
- D29DB0
≈ Quilted Heart
- D0A486
≈ Sunset Beige
Bộ bốn +90° +180° +270°
- 7ABBC3
Cuttlefish
- B1A6D5
≈ Ariel’s Delight
- D69E98
≈ Evening Dress
- ACB483
≈ Great Green
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 2.15:1 · APCA Lc 42
Ag
AAATrên nền đen
WCAG 9.72:1 · APCA Lc 60
Màu chữ tốt nhất: #000000
WCAG 9.72:1 (AAA) · APCA Lc 60
Contrast pairs
Đoạn mã
CSS
:root {
--cuttlefish: #7abbc3;
--cuttlefish-rgb: 122 187 195;
--cuttlefish-oklch: oklch(0.751 0.067 205.7);
}
.element {
color: var(--cuttlefish);
background-color: hsl(187 38% 62%);
border-color: oklch(0.751 0.067 205.7);
}Tailwind CSS v4
@theme {
--color-cuttlefish: #7abbc3;
--color-cuttlefish-50: #e0fbff;
--color-cuttlefish-100: #cfeff3;
--color-cuttlefish-200: #b4dde3;
--color-cuttlefish-300: #8fc2c9;
--color-cuttlefish-400: #6daab2;
--color-cuttlefish-500: #4a939c;
--color-cuttlefish-600: #407c84;
--color-cuttlefish-700: #336469;
--color-cuttlefish-800: #23494d;
--color-cuttlefish-900: #173335;
--color-cuttlefish-950: #081e21;
}SCSS
$cuttlefish: #7abbc3;
$cuttlefish-rgb: 122, 187, 195;
$cuttlefish-light: mix(#fff, $cuttlefish, 20%);
$cuttlefish-dark: mix(#000, $cuttlefish, 20%);
.element {
color: $cuttlefish;
box-shadow: 0 0 0 2px rgba($cuttlefish, 0.35);
}