色名 · #74CED2
Soft Turquoise
Soft Turquoiseは#74CED2：rgb(116 206 210)、hsl(183 51% 64%)、oklch(0.797 0.087 199.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Soft Turquoise color name →
#74CED2
oklch(0.797 0.087 199.3)
カラー変換
- HEX
- #74ced2
- RGB
- rgb(116 206 210)
- HSL
- hsl(183 51% 64%)
- HWB
- hwb(183 45% 18%)
- OKLCH
- oklch(0.797 0.087 199.3)
- OKLab
- oklab(0.797 -0.082 -0.029)
- CIE Lab
- lab(77.3 -27.4 -10.89)
- LCH
- lch(77.3 29.48 201.7)
- CMYK
- cmyk(45% 2% 0% 18%)
ティント · シェード · トーン
ティント
- 84D3D6
- 93D8DB
- A1DDDF
- AFE2E4
- BDE7E8
- CBECED
- D8F1F1
- E5F5F6
- F2FAFA
シェード
- 64B3B6
- 54989B
- 457F81
- 376668
- 294E50
- 1B3839
- 0F2324
- 050F10
- 010202
トーン
- 77C6CA
- 7ABEC1
- 7CB6B9
- 7DAEB0
- 7FA7A8
- 809FA0
- 809798
- 808F90
- 808888
カラーハーモニー
補色 +180°
- 74CED2
Soft Turquoise
- EFA7A6
≈ Faint of Heart
類似色 -30° +30°
- 74CED2
Soft Turquoise
- 82CFB3
≈ Lavish Green
- 80C8EA
≈ Fish Pond
トライアド +120° +240°
- 74CED2
Soft Turquoise
- D5ABE0
≈ Barely Bloomed
- DBB77C
≈ Soft Chamois
スプリットコンプリメンタリー +150° +210°
- 74CED2
Soft Turquoise
- E8A6C5
≈ Think Pink
- EBAD8B
≈ Coral Dust
テトラード +90° +180° +270°
- 74CED2
Soft Turquoise
- BBB4F1
≈ Purple Sand
- EFA7A6
≈ Faint of Heart
- C0C280
≈ Pine Glade
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.82:1 · APCA Lc 34
Ag
AAA黒の上
WCAG 11.50:1 · APCA Lc 69
最適な文字色: #000000
WCAG 11.50:1 (AAA) · APCA Lc 69
Contrast pairs
コードスニペット
CSS
:root {
--soft-turquoise: #74ced2;
--soft-turquoise-rgb: 116 206 210;
--soft-turquoise-oklch: oklch(0.797 0.087 199.3);
}
.element {
color: var(--soft-turquoise);
background-color: hsl(183 51% 64%);
border-color: oklch(0.797 0.087 199.3);
}Tailwind CSS v4
@theme {
--color-soft-turquoise: #74ced2;
--color-soft-turquoise-50: #dafdff;
--color-soft-turquoise-100: #c7f1f4;
--color-soft-turquoise-200: #a9e0e4;
--color-soft-turquoise-300: #81c5ca;
--color-soft-turquoise-400: #59aeb2;
--color-soft-turquoise-500: #28979c;
--color-soft-turquoise-600: #258084;
--color-soft-turquoise-700: #1e666a;
--color-soft-turquoise-800: #134b4d;
--color-soft-turquoise-900: #0d3435;
--color-soft-turquoise-950: #012021;
}SCSS
$soft-turquoise: #74ced2;
$soft-turquoise-rgb: 116, 206, 210;
$soft-turquoise-light: mix(#fff, $soft-turquoise, 20%);
$soft-turquoise-dark: mix(#000, $soft-turquoise, 20%);
.element {
color: $soft-turquoise;
box-shadow: 0 0 0 2px rgba($soft-turquoise, 0.35);
}