色名 · #00DDCC
Mint Morning
Mint Morningは#00DDCC：rgb(0 221 204)、hsl(175 100% 43%)、oklch(0.807 0.142 185.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Mint Morning color name →
#00DDCC
oklch(0.807 0.142 185.1)
カラー変換
- HEX
- #00ddcc
- RGB
- rgb(0 221 204)
- HSL
- hsl(175 100% 43%)
- HWB
- hwb(175 0% 13%)
- OKLCH
- oklch(0.807 0.142 185.1)
- OKLab
- oklab(0.807 -0.142 -0.013)
- CIE Lab
- lab(79.33 -49.24 -5.05)
- LCH
- lch(79.33 49.5 185.9)
- CMYK
- cmyk(100% 0% 8% 13%)
ティント · シェード · トーン
ティント
- 48E1D1
- 67E5D6
- 80E8DB
- 95ECE0
- A9EFE5
- BCF3EA
- CDF6EF
- DEF9F5
- EFFCFA
シェード
- 00C0B1
- 00A497
- 00887E
- 006E65
- 00554E
- 003D37
- 002622
- 00110F
- 000202
トーン
- 35D4C4
- 49CABC
- 57C1B5
- 61B8AD
- 6AAEA5
- 70A59E
- 769C96
- 7A928F
- 7D8987
カラーハーモニー
補色 +180°
- 00DDCC
Mint Morning
- FFA0B6
≈ Saira Red
類似色 -30° +30°
- 00DDCC
Mint Morning
- 6ADB97
≈ Aurora Green
- 05D6F9
≈ Neon Blue
トライアド +120° +240°
- 00DDCC
Mint Morning
- D2ACFF
≈ Purple Hepatica
- FEAB52
≈ Soul Side
スプリットコンプリメンタリー +150° +210°
- 00DDCC
Mint Morning
- F89BE4
≈ Lavender Rose
- FFA68F
≈ Frozen Salmon
テトラード +90° +180° +270°
- 00DDCC
Mint Morning
- ADBBFF
≈ Greyish Lavender
- FFA0B6
≈ Saira Red
- DDBE43
≈ Buried Gold
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.71:1 · APCA Lc 30
Ag
AAA黒の上
WCAG 12.21:1 · APCA Lc 73
最適な文字色: #000000
WCAG 12.21:1 (AAA) · APCA Lc 73
Contrast pairs
コードスニペット
CSS
:root {
--mint-morning: #00ddcc;
--mint-morning-rgb: 0 221 204;
--mint-morning-oklch: oklch(0.807 0.142 185.1);
}
.element {
color: var(--mint-morning);
background-color: hsl(175 100% 43%);
border-color: oklch(0.807 0.142 185.1);
}Tailwind CSS v4
@theme {
--color-mint-morning: #00ddcc;
--color-mint-morning-50: #c7fffc;
--color-mint-morning-100: #b1f8f0;
--color-mint-morning-200: #89e8de;
--color-mint-morning-300: #4dcfc4;
--color-mint-morning-400: #00b9a9;
--color-mint-morning-500: #00a393;
--color-mint-morning-600: #00897c;
--color-mint-morning-700: #006e63;
--color-mint-morning-800: #005147;
--color-mint-morning-900: #003931;
--color-mint-morning-950: #00231d;
}SCSS
$mint-morning: #00ddcc;
$mint-morning-rgb: 0, 221, 204;
$mint-morning-light: mix(#fff, $mint-morning, 20%);
$mint-morning-dark: mix(#000, $mint-morning, 20%);
.element {
color: $mint-morning;
box-shadow: 0 0 0 2px rgba($mint-morning, 0.35);
}