最も近い色名 · #F88A83
#F88A83
最も近い色名: Strawberry Field
#F88A83（rgb(248 138 131)、hsl(4 89% 74%)、oklch(0.751 0.135 24.6)）に最も近い色名はStrawberry Fieldです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#F88A83
oklch(0.751 0.135 24.6)
カラー変換
- HEX
- #f88a83
- RGB
- rgb(248 138 131)
- HSL
- hsl(4 89% 74%)
- HWB
- hwb(4 51% 3%)
- OKLCH
- oklch(0.751 0.135 24.6)
- OKLab
- oklab(0.751 0.123 0.056)
- CIE Lab
- lab(69.81 42.17 23.29)
- LCH
- lch(69.81 48.18 28.9)
- CMYK
- cmyk(0% 44% 47% 3%)
ティント · シェード · トーン
ティント
- FA968F
- FCA29B
- FEAEA7
- FFBAB4
- FFC6C0
- FFD1CD
- FFDDD9
- FFE8E6
- FFF4F2
シェード
- D87771
- B86560
- 9A534F
- 7C423F
- 60322F
- 452220
- 2C1412
- 150706
- 030101
トーン
- EC8A83
- E18983
- D58983
- C98883
- BD8782
- B18682
- A58582
- 998381
- 8D8281
カラーハーモニー
補色 +180°
- F88A83
Strawberry Field
- 00C5D4
≈ Turquoise Surf
類似色 -30° +30°
- F88A83
Strawberry Field
- F088B3
≈ Brown Knapweed
- EF9555
≈ Toucan
トライアド +120° +240°
- F88A83
Strawberry Field
- 75C477
≈ Soft Green
- 86ACFF
≈ Kitten’s Eye
スプリットコンプリメンタリー +150° +210°
- F88A83
Strawberry Field
- 27CAA9
≈ Jadeite
- 43BBF7
≈ Megaman
テトラード +90° +180° +270°
- F88A83
Strawberry Field
- ACB849
≈ Hopscotch
- 00C5D4
≈ Turquoise Surf
- B49CFB
≈ Baby Purple
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.34:1 · APCA Lc 46
Ag
AAA黒の上
WCAG 8.95:1 · APCA Lc 56
最適な文字色: #000000
WCAG 8.95:1 (AAA) · APCA Lc 56
Contrast pairs
コードスニペット
CSS
:root {
--strawberry-field: #f88a83;
--strawberry-field-rgb: 248 138 131;
--strawberry-field-oklch: oklch(0.751 0.135 24.6);
}
.element {
color: var(--strawberry-field);
background-color: hsl(4 89% 74%);
border-color: oklch(0.751 0.135 24.6);
}Tailwind CSS v4
@theme {
--color-strawberry-field: #f88a83;
--color-strawberry-field-50: #ffe7e1;
--color-strawberry-field-100: #ffd7d0;
--color-strawberry-field-200: #ffbfb6;
--color-strawberry-field-300: #f59c92;
--color-strawberry-field-400: #e37c76;
--color-strawberry-field-500: #d05c58;
--color-strawberry-field-600: #b04f4b;
--color-strawberry-field-700: #8e3f3b;
--color-strawberry-field-800: #692d2c;
--color-strawberry-field-900: #4a1e1e;
--color-strawberry-field-950: #300d0e;
}SCSS
$strawberry-field: #f88a83;
$strawberry-field-rgb: 248, 138, 131;
$strawberry-field-light: mix(#fff, $strawberry-field, 20%);
$strawberry-field-dark: mix(#000, $strawberry-field, 20%);
.element {
color: $strawberry-field;
box-shadow: 0 0 0 2px rgba($strawberry-field, 0.35);
}