Màu có tên · #7DBCAA
Ocean Wave
Ocean Wave là #7DBCAA: rgb(125 188 170), hsl(163 32% 61%), oklch(0.747 0.07 174.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 Teal mean? → · Ocean Wave color name →
#7DBCAA
oklch(0.747 0.07 174.4)
Chuyển đổi màu
- HEX
- #7dbcaa
- RGB
- rgb(125 188 170)
- HSL
- hsl(163 32% 61%)
- HWB
- hwb(163 49% 26%)
- OKLCH
- oklch(0.747 0.07 174.4)
- OKLab
- oklab(0.747 -0.07 0.007)
- CIE Lab
- lab(71.59 -24.09 2.37)
- LCH
- lch(71.59 24.21 174.4)
- CMYK
- cmyk(34% 0% 10% 26%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- 8BC3B2
- 98C9BA
- A5D0C3
- B2D7CB
- BFDDD4
- CCE4DC
- D8EBE5
- E5F2EE
- F2F8F6
Sắc đậm
- 6CA393
- 5B8B7D
- 4B7368
- 3B5D53
- 2C473F
- 1E322D
- 111F1B
- 050D0B
- 010201
Sắc xám
- 7EB6A6
- 7FB0A1
- 80AA9D
- 80A499
- 819E95
- 819891
- 81928C
- 818C88
- 808684
Hòa sắc
Bổ túc +180°
- 7DBCAA
Ocean Wave
- D29BB0
≈ Haute Pink
Tương đồng -30° +30°
- 7DBCAA
Ocean Wave
- 92B992
≈ Brookview
- 76BAC2
≈ Aqua Sky
Bộ ba +120° +240°
- 7DBCAA
Ocean Wave
- AFA5D6
≈ Ariel’s Delight
- D1A283
≈ Orange Maple
Bổ túc chia +150° +210°
- 7DBCAA
Ocean Wave
- C49EC6
≈ Lilac Pink
- D69C97
≈ Shanghai Peach
Bộ bốn +90° +180° +270°
- 7DBCAA
Ocean Wave
- 97ADDA
≈ Blue Skies Today
- D29BB0
≈ Haute Pink
- C2AA7A
≈ Cobbler
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 2.17:1 · APCA Lc 43
Ag
AAATrên nền đen
WCAG 9.64:1 · APCA Lc 59
Màu chữ tốt nhất: #000000
WCAG 9.64:1 (AAA) · APCA Lc 59
Contrast pairs
Đoạn mã
CSS
:root {
--ocean-wave: #7dbcaa;
--ocean-wave-rgb: 125 188 170;
--ocean-wave-oklch: oklch(0.747 0.07 174.4);
}
.element {
color: var(--ocean-wave);
background-color: hsl(163 32% 61%);
border-color: oklch(0.747 0.07 174.4);
}Tailwind CSS v4
@theme {
--color-ocean-wave: #7dbcaa;
--color-ocean-wave-50: #e1fcf4;
--color-ocean-wave-100: #d1f0e7;
--color-ocean-wave-200: #b6dfd3;
--color-ocean-wave-300: #91c4b6;
--color-ocean-wave-400: #71ac9c;
--color-ocean-wave-500: #4f9683;
--color-ocean-wave-600: #447e6f;
--color-ocean-wave-700: #366559;
--color-ocean-wave-800: #274a40;
--color-ocean-wave-900: #1a342c;
--color-ocean-wave-950: #0a1f19;
}SCSS
$ocean-wave: #7dbcaa;
$ocean-wave-rgb: 125, 188, 170;
$ocean-wave-light: mix(#fff, $ocean-wave, 20%);
$ocean-wave-dark: mix(#000, $ocean-wave, 20%);
.element {
color: $ocean-wave;
box-shadow: 0 0 0 2px rgba($ocean-wave, 0.35);
}