色名 · #73CCD8
Slick Blue
Slick Blueは#73CCD8：rgb(115 204 216)、hsl(187 56% 65%)、oklch(0.794 0.087 206.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Cyan mean? → · Slick Blue color name →
#73CCD8
oklch(0.794 0.087 206.8)
カラー変換
- HEX
- #73ccd8
- RGB
- rgb(115 204 216)
- HSL
- hsl(187 56% 65%)
- HWB
- hwb(187 45% 15%)
- OKLCH
- oklch(0.794 0.087 206.8)
- OKLab
- oklab(0.794 -0.078 -0.039)
- CIE Lab
- lab(76.84 -25.55 -14.79)
- LCH
- lch(76.84 29.52 210.1)
- CMYK
- cmyk(47% 6% 0% 15%)
ティント · シェード · トーン
ティント
- 83D1DC
- 92D6E0
- A1DCE4
- AFE1E8
- BDE6EC
- CAEBEF
- D7F0F3
- E5F5F7
- F2FAFB
シェード
- 63B1BC
- 5497A0
- 457E85
- 36656B
- 284E53
- 1B373B
- 0F2225
- 050F11
- 010202
トーン
- 76C4CF
- 79BDC6
- 7BB5BD
- 7DADB4
- 7EA6AB
- 7F9EA2
- 80969A
- 808F91
- 808788
カラーハーモニー
補色 +180°
- 73CCD8
Slick Blue
- EFA79E
≈ Mad About Maddie
類似色 -30° +30°
- 73CCD8
Slick Blue
- 7BCFBA
≈ Lavish Green
- 84C5ED
≈ Wasurenagusa Blue
トライアド +120° +240°
- 73CCD8
Slick Blue
- DAA8D9
≈ Barely Bloomed
- D4B97A
≈ Further Afield
スプリットコンプリメンタリー +150° +210°
- 73CCD8
Slick Blue
- EAA5BD
≈ Hushed Rose
- E7AE85
≈ Soft Skills
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.84:1 · APCA Lc 35
Ag
AAA黒の上
WCAG 11.35:1 · APCA Lc 68
最適な文字色: #000000
WCAG 11.35:1 (AAA) · APCA Lc 68
Contrast pairs
コードスニペット
CSS
:root {
--slick-blue: #73ccd8;
--slick-blue-rgb: 115 204 216;
--slick-blue-oklch: oklch(0.794 0.087 206.8);
}
.element {
color: var(--slick-blue);
background-color: hsl(187 56% 65%);
border-color: oklch(0.794 0.087 206.8);
}Tailwind CSS v4
@theme {
--color-slick-blue: #73ccd8;
--color-slick-blue-50: #dafdff;
--color-slick-blue-100: #c7f1f8;
--color-slick-blue-200: #a9dfe8;
--color-slick-blue-300: #81c4cf;
--color-slick-blue-400: #59adb8;
--color-slick-blue-500: #2996a3;
--color-slick-blue-600: #267f8a;
--color-slick-blue-700: #1e666e;
--color-slick-blue-800: #134b51;
--color-slick-blue-900: #0c3438;
--color-slick-blue-950: #001f23;
}SCSS
$slick-blue: #73ccd8;
$slick-blue-rgb: 115, 204, 216;
$slick-blue-light: mix(#fff, $slick-blue, 20%);
$slick-blue-dark: mix(#000, $slick-blue, 20%);
.element {
color: $slick-blue;
box-shadow: 0 0 0 2px rgba($slick-blue, 0.35);
}