最も近い色名 · #BE8E97
#BE8E97
最も近い色名: Punched Pink
#BE8E97(rgb(190 142 151)、hsl(349 27% 65%)、oklch(0.695 0.059 6.3))に最も近い色名はPunched Pinkです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#BE8E97
oklch(0.695 0.059 6.3)
カラー変換
- HEX
- #be8e97
- RGB
- rgb(190 142 151)
- HSL
- hsl(349 27% 65%)
- HWB
- hwb(349 56% 25%)
- OKLCH
- oklch(0.695 0.059 6.3)
- OKLab
- oklab(0.695 0.059 0.006)
- CIE Lab
- lab(63.94 19.75 2.7)
- LCH
- lch(63.94 19.94 7.8)
- CMYK
- cmyk(0% 25% 21% 25%)
ティント · シェード · トーン
ティント
- C599A1
- CBA4AB
- D2AFB5
- D9BABF
- DFC5CA
- E6D1D4
- ECDCDF
- F2E8E9
- F9F3F4
シェード
- A57B83
- 8C686F
- 75565C
- 5E4449
- 483437
- 332426
- 1F1517
- 0D0708
- 020101
トーン
- B88D95
- B28B92
- AC8A90
- A5898E
- 9F878B
- 998689
- 938487
- 8D8385
- 868282
カラーハーモニー
補色 +180°
- BE8E97
Punched Pink
- 72A9A2
≈ Steel Pan Mallet
類似色 -30° +30°
- BE8E97
Punched Pink
- B58FAB
≈ Soft Impact
- BF9084
≈ Revival Rose
トライアド +120° +240°
- BE8E97
Punched Pink
- 93A47C
≈ Broccoflower
- 7FA1C0
≈ Far Horizons
スプリットコンプリメンタリー +150° +210°
- BE8E97
Punched Pink
- 7FA88E
≈ Catnip
- 72A7B5
≈ Blue Chiffon
テトラード +90° +180° +270°
- BE8E97
Punched Pink
- A89D73
≈ Fresh Olive
- 72A9A2
≈ Steel Pan Mallet
- 939AC2
≈ Grape Ivy
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.79:1 · APCA Lc 54
Ag
AAA黒の上
WCAG 7.50:1 · APCA Lc 48
最適な文字色: #000000
WCAG 7.50:1 (AAA) · APCA Lc 48
Contrast pairs
コードスニペット
CSS
:root {
--punched-pink: #be8e97;
--punched-pink-rgb: 190 142 151;
--punched-pink-oklch: oklch(0.695 0.059 6.3);
}
.element {
color: var(--punched-pink);
background-color: hsl(349 27% 65%);
border-color: oklch(0.695 0.059 6.3);
}Tailwind CSS v4
@theme {
--color-punched-pink: #be8e97;
--color-punched-pink-50: #ffeff2;
--color-punched-pink-100: #fbe0e4;
--color-punched-pink-200: #eccacf;
--color-punched-pink-300: #d4abb1;
--color-punched-pink-400: #be9099;
--color-punched-pink-500: #a97680;
--color-punched-pink-600: #8f646c;
--color-punched-pink-700: #725056;
--color-punched-pink-800: #543a40;
--color-punched-pink-900: #3b282c;
--color-punched-pink-950: #251619;
}SCSS
$punched-pink: #be8e97;
$punched-pink-rgb: 190, 142, 151;
$punched-pink-light: mix(#fff, $punched-pink, 20%);
$punched-pink-dark: mix(#000, $punched-pink, 20%);
.element {
color: $punched-pink;
box-shadow: 0 0 0 2px rgba($punched-pink, 0.35);
}