最も近い色名 · #BB4158
#BB4158
最も近い色名: Merlot Magic
#BB4158（rgb(187 65 88)、hsl(349 48% 49%)、oklch(0.552 0.157 12.7)）に最も近い色名はMerlot Magicです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#BB4158
oklch(0.552 0.157 12.7)
カラー変換
- HEX
- #bb4158
- RGB
- rgb(187 65 88)
- HSL
- hsl(349 48% 49%)
- HWB
- hwb(349 25% 27%)
- OKLCH
- oklch(0.552 0.157 12.7)
- OKLab
- oklab(0.552 0.153 0.034)
- CIE Lab
- lab(46.23 51.03 14.75)
- LCH
- lch(46.23 53.12 16.1)
- CMYK
- cmyk(0% 65% 53% 27%)
ティント · シェード · トーン
ティント
- C45667
- CD6A77
- D57D87
- DC8F97
- E3A2A8
- EAB4B9
- F0C7CA
- F6D9DB
- FBECED
シェード
- A2374B
- 8A2E3F
- 732533
- 5C1C28
- 46131D
- 320B12
- 1F0509
- 0D0103
- 020000
トーン
- B64A5C
- B25260
- AD5964
- A75F68
- A2656C
- 9C6B70
- 967174
- 8F7678
- 887B7C
カラーハーモニー
補色 +180°
- BB4158
Merlot Magic
- 008381
≈ Windows 95 Desktop
類似色 -30° +30°
- BB4158
Merlot Magic
- AD458A
≈ Romantic Rose
- BA4A10
≈ Bolognese
トライアド +120° +240°
- BB4158
Merlot Magic
- 4C8400
≈ Kelp Forest
- 1873CA
≈ Science Blue
スプリットコンプリメンタリー +150° +210°
- BB4158
Merlot Magic
- 00875D
≈ Primal Green
- 007E9D
≈ Amazing Sky
テトラード +90° +180° +270°
- BB4158
Merlot Magic
- 7F7400
≈ Tool Green
- 008381
≈ Windows 95 Desktop
- 6761CA
≈ Dark Periwinkle
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 5.23:1 · APCA Lc 75
Ag
Fail黒の上
WCAG 4.00:1 · APCA Lc 27
最適な文字色: #FFFFFF
WCAG 5.23:1 (AA) · APCA Lc 75
Contrast pairs
コードスニペット
CSS
:root {
--merlot-magic: #bb4158;
--merlot-magic-rgb: 187 65 88;
--merlot-magic-oklch: oklch(0.552 0.157 12.7);
}
.element {
color: var(--merlot-magic);
background-color: hsl(349 48% 49%);
border-color: oklch(0.552 0.157 12.7);
}Tailwind CSS v4
@theme {
--color-merlot-magic: #bb4158;
--color-merlot-magic-50: #ffe4e7;
--color-merlot-magic-100: #ffd3d7;
--color-merlot-magic-200: #ffb9bf;
--color-merlot-magic-300: #fd959e;
--color-merlot-magic-400: #eb7384;
--color-merlot-magic-500: #d94f69;
--color-merlot-magic-600: #b74459;
--color-merlot-magic-700: #933647;
--color-merlot-magic-800: #6e2635;
--color-merlot-magic-900: #4d1a24;
--color-merlot-magic-950: #330913;
}SCSS
$merlot-magic: #bb4158;
$merlot-magic-rgb: 187, 65, 88;
$merlot-magic-light: mix(#fff, $merlot-magic, 20%);
$merlot-magic-dark: mix(#000, $merlot-magic, 20%);
.element {
color: $merlot-magic;
box-shadow: 0 0 0 2px rgba($merlot-magic, 0.35);
}