最も近い色名 · #FF9AA1
#FF9AA1
最も近い色名: Strawberry Frappé
#FF9AA1（rgb(255 154 161)、hsl(356 100% 80%)、oklch(0.792 0.121 15.7)）に最も近い色名はStrawberry Frappéです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#FF9AA1
oklch(0.792 0.121 15.7)
カラー変換
- HEX
- #ff9aa1
- RGB
- rgb(255 154 161)
- HSL
- hsl(356 100% 80%)
- HWB
- hwb(356 60% 0%)
- OKLCH
- oklch(0.792 0.121 15.7)
- OKLab
- oklab(0.792 0.117 0.033)
- CIE Lab
- lab(74.56 39.24 13.42)
- LCH
- lch(74.56 41.47 18.9)
- CMYK
- cmyk(0% 40% 37% 0%)
ティント · シェード · トーン
ティント
- FFA4AA
- FFAFB3
- FFB9BD
- FFC3C6
- FFCDCF
- FFD7D9
- FFE1E2
- FFEBEC
- FFF5F5
シェード
- DE858B
- BE7176
- 9E5E62
- 804B4E
- 63393C
- 48272A
- 2E1719
- 160909
- 030101
トーン
- F2989E
- E6969A
- D99397
- CD9194
- C08E91
- B38C8D
- A7898A
- 9A8687
- 8D8383
カラーハーモニー
補色 +180°
- FF9AA1
Strawberry Frappé
- 3ED3D4
≈ Medium Turquoise
類似色 -30° +30°
- FF9AA1
Strawberry Frappé
- F39BCC
≈ Pearly Pink
- FBA277
≈ Butternut
トライアド +120° +240°
- FF9AA1
Strawberry Frappé
- 98CD7D
≈ Jade Lime
- 8DBEFF
≈ Scenic Water
スプリットコンプリメンタリー +150° +210°
- FF9AA1
Strawberry Frappé
- 64D4A9
≈ Crystal Gem
- 55CBF6
≈ Thor’s Thunder
テトラード +90° +180° +270°
- FF9AA1
Strawberry Frappé
- C6C05D
≈ Sulphur Yellow
- 3ED3D4
≈ Medium Turquoise
- B5B1FF
≈ Winterspring Lilac
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.02:1 · APCA Lc 39
Ag
AAA黒の上
WCAG 10.38:1 · APCA Lc 63
最適な文字色: #000000
WCAG 10.38:1 (AAA) · APCA Lc 63
Contrast pairs
コードスニペット
CSS
:root {
--strawberry-frappe: #ff9aa1;
--strawberry-frappe-rgb: 255 154 161;
--strawberry-frappe-oklch: oklch(0.792 0.121 15.7);
}
.element {
color: var(--strawberry-frappe);
background-color: hsl(356 100% 80%);
border-color: oklch(0.792 0.121 15.7);
}Tailwind CSS v4
@theme {
--color-strawberry-frappe: #ff9aa1;
--color-strawberry-frappe-50: #ffe8e8;
--color-strawberry-frappe-100: #ffd8d9;
--color-strawberry-frappe-200: #ffc0c1;
--color-strawberry-frappe-300: #ef9ea0;
--color-strawberry-frappe-400: #dc7f86;
--color-strawberry-frappe-500: #c9616b;
--color-strawberry-frappe-600: #aa525b;
--color-strawberry-frappe-700: #894248;
--color-strawberry-frappe-800: #652f36;
--color-strawberry-frappe-900: #472025;
--color-strawberry-frappe-950: #2e0f13;
}SCSS
$strawberry-frappe: #ff9aa1;
$strawberry-frappe-rgb: 255, 154, 161;
$strawberry-frappe-light: mix(#fff, $strawberry-frappe, 20%);
$strawberry-frappe-dark: mix(#000, $strawberry-frappe, 20%);
.element {
color: $strawberry-frappe;
box-shadow: 0 0 0 2px rgba($strawberry-frappe, 0.35);
}