色名 · #FA8E99
Strawberry Shortcake
Strawberry Shortcakeは#FA8E99：rgb(250 142 153)、hsl(354 92% 77%)、oklch(0.765 0.131 14.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Strawberry Shortcake color name →
#FA8E99
oklch(0.765 0.131 14.1)
カラー変換
- HEX
- #fa8e99
- RGB
- rgb(250 142 153)
- HSL
- hsl(354 92% 77%)
- HWB
- hwb(354 56% 2%)
- OKLCH
- oklch(0.765 0.131 14.1)
- OKLab
- oklab(0.765 0.127 0.032)
- CIE Lab
- lab(71.28 42.6 13.16)
- LCH
- lch(71.28 44.58 17.2)
- CMYK
- cmyk(0% 43% 39% 2%)
ティント · シェード · トーン
ティント
- FC9AA3
- FDA5AD
- FFB1B7
- FFBCC1
- FFC7CB
- FFD3D5
- FFDEE0
- FFE9EA
- FFF4F4
シェード
- D97B84
- BA6870
- 9B565D
- 7D444A
- 613438
- 462427
- 2D1517
- 150708
- 030101
トーン
- EE8D97
- E28C94
- D68B92
- CA8A8F
- BE898D
- B2878A
- A68688
- 998485
- 8D8283
カラーハーモニー
補色 +180°
- FA8E99
Strawberry Shortcake
- 00CCCB
≈ Tilla Kari Mosque
類似色 -30° +30°
- FA8E99
Strawberry Shortcake
- ED8FC7
≈ Blushed Bombshell
- F7966B
≈ Autumn Arrival
トライアド +120° +240°
- FA8E99
Strawberry Shortcake
- 8FC56D
≈ Jaunty Green
- 7AB6FF
≈ Parakeet Blue
スプリットコンプリメンタリー +150° +210°
- FA8E99
Strawberry Shortcake
- 52CD9C
≈ Vegetation
- 36C4F0
≈ Clean Pool
テトラード +90° +180° +270°
- FA8E99
Strawberry Shortcake
- C0B648
≈ Parachute
- 00CCCB
≈ Tilla Kari Mosque
- A9A7FF
≈ Shy Moment
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.23:1 · APCA Lc 44
Ag
AAA黒の上
WCAG 9.39:1 · APCA Lc 58
最適な文字色: #000000
WCAG 9.39:1 (AAA) · APCA Lc 58
Contrast pairs
コードスニペット
CSS
:root {
--strawberry-shortcake: #fa8e99;
--strawberry-shortcake-rgb: 250 142 153;
--strawberry-shortcake-oklch: oklch(0.765 0.131 14.1);
}
.element {
color: var(--strawberry-shortcake);
background-color: hsl(354 92% 77%);
border-color: oklch(0.765 0.131 14.1);
}Tailwind CSS v4
@theme {
--color-strawberry-shortcake: #fa8e99;
--color-strawberry-shortcake-50: #ffe7e8;
--color-strawberry-shortcake-100: #ffd7d9;
--color-strawberry-shortcake-200: #ffbec1;
--color-strawberry-shortcake-300: #f39ca0;
--color-strawberry-shortcake-400: #e07c87;
--color-strawberry-shortcake-500: #ce5c6b;
--color-strawberry-shortcake-600: #ae4f5b;
--color-strawberry-shortcake-700: #8c3f49;
--color-strawberry-shortcake-800: #682d36;
--color-strawberry-shortcake-900: #491e25;
--color-strawberry-shortcake-950: #2f0e14;
}SCSS
$strawberry-shortcake: #fa8e99;
$strawberry-shortcake-rgb: 250, 142, 153;
$strawberry-shortcake-light: mix(#fff, $strawberry-shortcake, 20%);
$strawberry-shortcake-dark: mix(#000, $strawberry-shortcake, 20%);
.element {
color: $strawberry-shortcake;
box-shadow: 0 0 0 2px rgba($strawberry-shortcake, 0.35);
}