最も近い色名 · #00C1AA
#00C1AA
最も近い色名: Turquoise
#00C1AA（rgb(0 193 170)、hsl(173 100% 38%)、oklch(0.727 0.132 180.2)）に最も近い色名はTurquoiseです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#00C1AA
oklch(0.727 0.132 180.2)
カラー変換
- HEX
- #00c1aa
- RGB
- rgb(0 193 170)
- HSL
- hsl(173 100% 38%)
- HWB
- hwb(173 0% 24%)
- OKLCH
- oklch(0.727 0.132 180.2)
- OKLab
- oklab(0.727 -0.132 0)
- CIE Lab
- lab(69.94 -46.22 -0.48)
- LCH
- lch(69.94 46.23 180.6)
- CMYK
- cmyk(100% 0% 12% 24%)
ティント · シェード · トーン
ティント
- 42C8B2
- 60CEBA
- 78D4C3
- 8EDBCB
- A2E1D4
- B6E7DC
- C9EDE5
- DBF3ED
- EDF9F6
シェード
- 00A793
- 008F7D
- 007768
- 005F53
- 00493F
- 00342D
- 00201B
- 000E0B
- 000201
トーン
- 2FBBA6
- 43B4A1
- 51AE9D
- 5BA799
- 64A195
- 6B9A91
- 72948C
- 778D88
- 7C8784
カラーハーモニー
補色 +180°
- 00C1AA
Turquoise
- E981A3
≈ Aurora Pink
類似色 -30° +30°
- 00C1AA
Turquoise
- 63BE7A
≈ Verdigris Coloured
- 00BBD2
≈ Holiday Blue
トライアド +120° +240°
- 00C1AA
Turquoise
- B492ED
≈ Dreamy Candy Forest
- E29148
≈ Yellow Sumac
スプリットコンプリメンタリー +150° +210°
- 00C1AA
Turquoise
- D587CE
≈ Pink Punk
- EE8574
≈ Coralette
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.28:1 · APCA Lc 44
Ag
AAA黒の上
WCAG 9.20:1 · APCA Lc 58
最適な文字色: #000000
WCAG 9.20:1 (AAA) · APCA Lc 58
Contrast pairs
コードスニペット
CSS
:root {
--turquoise: #00c1aa;
--turquoise-rgb: 0 193 170;
--turquoise-oklch: oklch(0.727 0.132 180.2);
}
.element {
color: var(--turquoise);
background-color: hsl(173 100% 38%);
border-color: oklch(0.727 0.132 180.2);
}Tailwind CSS v4
@theme {
--color-turquoise: #00c1aa;
--color-turquoise-50: #ccfff8;
--color-turquoise-100: #b7f7eb;
--color-turquoise-200: #92e7d9;
--color-turquoise-300: #5ecdbd;
--color-turquoise-400: #0eb7a2;
--color-turquoise-500: #00a18a;
--color-turquoise-600: #008875;
--color-turquoise-700: #006d5d;
--color-turquoise-800: #005142;
--color-turquoise-900: #00382e;
--color-turquoise-950: #00221b;
}SCSS
$turquoise: #00c1aa;
$turquoise-rgb: 0, 193, 170;
$turquoise-light: mix(#fff, $turquoise, 20%);
$turquoise-dark: mix(#000, $turquoise, 20%);
.element {
color: $turquoise;
box-shadow: 0 0 0 2px rgba($turquoise, 0.35);
}