最も近い色名 · #F66C94
#F66C94
最も近い色名: Embarrassed
#F66C94（rgb(246 108 148)、hsl(343 88% 69%)、oklch(0.709 0.173 4.4)）に最も近い色名はEmbarrassedです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#F66C94
oklch(0.709 0.173 4.4)
カラー変換
- HEX
- #f66c94
- RGB
- rgb(246 108 148)
- HSL
- hsl(343 88% 69%)
- HWB
- hwb(343 42% 4%)
- OKLCH
- oklch(0.709 0.173 4.4)
- OKLab
- oklab(0.709 0.172 0.013)
- CIE Lab
- lab(64.2 56.53 5.97)
- LCH
- lch(64.2 56.84 6)
- CMYK
- cmyk(0% 56% 40% 4%)
ティント · シェード · トーン
ティント
- F97C9E
- FC8CA9
- FE9BB3
- FFAABE
- FFB8C8
- FFC6D3
- FFD5DE
- FFE3E9
- FFF1F4
シェード
- D65D80
- B74E6D
- 98405A
- 7B3248
- 5F2536
- 451926
- 2C0D16
- 150408
- 030001
トーン
- EB7092
- E07390
- D4768E
- C9788C
- BE7A8A
- B27C88
- A67D86
- 9A7E84
- 8D7F82
カラーハーモニー
補色 +180°
- F66C94
Embarrassed
- 00BAAB
≈ Verditer
類似色 -30° +30°
- F66C94
Embarrassed
- E073CC
≈ Explicit Pink
- FA7253
≈ Often Orange
トライアド +120° +240°
- F66C94
Embarrassed
- 8AB213
≈ Brilliant Green
- 29A9FF
≈ Xed
スプリットコンプリメンタリー +150° +210°
- F66C94
Embarrassed
- 18BF6E
≈ Times Square Screens
- 00B4D1
≈ Aquarius
テトラード +90° +180° +270°
- F66C94
Embarrassed
- BF9F00
≈ Snakebite Leather
- 00BAAB
≈ Verditer
- 8698FF
≈ Periwinkle Blue
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.80:1 · APCA Lc 53
Ag
AAA黒の上
WCAG 7.49:1 · APCA Lc 49
最適な文字色: #000000
WCAG 7.49:1 (AAA) · APCA Lc 49
Contrast pairs
コードスニペット
CSS
:root {
--embarrassed: #f66c94;
--embarrassed-rgb: 246 108 148;
--embarrassed-oklch: oklch(0.709 0.173 4.4);
}
.element {
color: var(--embarrassed);
background-color: hsl(343 88% 69%);
border-color: oklch(0.709 0.173 4.4);
}Tailwind CSS v4
@theme {
--color-embarrassed: #f66c94;
--color-embarrassed-50: #ffe1ed;
--color-embarrassed-100: #ffd0de;
--color-embarrassed-200: #ffb5c8;
--color-embarrassed-300: #ff90a9;
--color-embarrassed-400: #ef6d92;
--color-embarrassed-500: #dd4678;
--color-embarrassed-600: #bb3d66;
--color-embarrassed-700: #963051;
--color-embarrassed-800: #6f223d;
--color-embarrassed-900: #4f172a;
--color-embarrassed-950: #340718;
}SCSS
$embarrassed: #f66c94;
$embarrassed-rgb: 246, 108, 148;
$embarrassed-light: mix(#fff, $embarrassed, 20%);
$embarrassed-dark: mix(#000, $embarrassed, 20%);
.element {
color: $embarrassed;
box-shadow: 0 0 0 2px rgba($embarrassed, 0.35);
}