最も近い色名 · #E51445
#E51445
最も近い色名: Crossing the Line
#E51445（rgb(229 20 69)、hsl(346 84% 49%)、oklch(0.589 0.229 18.2)）に最も近い色名はCrossing the Lineです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#E51445
oklch(0.589 0.229 18.2)
カラー変換
- HEX
- #e51445
- RGB
- rgb(229 20 69)
- HSL
- hsl(346 84% 49%)
- HWB
- hwb(346 8% 10%)
- OKLCH
- oklch(0.589 0.229 18.2)
- OKLab
- oklab(0.589 0.218 0.072)
- CIE Lab
- lab(49.85 73.79 32.9)
- LCH
- lch(49.85 80.79 24)
- CMYK
- cmyk(0% 91% 70% 10%)
ティント · シェード · トーン
ティント
- EB4057
- F15C69
- F6737B
- FA898D
- FD9DA0
- FFB1B2
- FFC5C5
- FFD8D8
- FFECEC
シェード
- C7103B
- AA0C31
- 8E0827
- 72051E
- 580315
- 3F010C
- 280105
- 120002
- 030000
トーン
- DD304C
- D44152
- CB4D58
- C2575E
- B96064
- AF686A
- A46F70
- 997575
- 8D7B7B
カラーハーモニー
補色 +180°
- E51445
Crossing the Line
- 008F93
≈ Christina Brown
類似色 -30° +30°
- E51445
Crossing the Line
- D52294
≈ Royal Fuchsia
- C55800
≈ Rust Orange
トライアド +120° +240°
- E51445
Crossing the Line
- 3A9400
≈ Planter
- 0074FC
≈ Deep Sky Blue
スプリットコンプリメンタリー +150° +210°
- E51445
Crossing the Line
- 009370
≈ Dòu Lǜ Green
- 0089B3
≈ Stomy Shower
テトラード +90° +180° +270°
- E51445
Crossing the Line
- 858200
≈ Drably Olive
- 008F93
≈ Christina Brown
- 7E57F9
≈ Venetian Nights
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 4.64:1 · APCA Lc 70
Ag
AA黒の上
WCAG 4.51:1 · APCA Lc 32
最適な文字色: #FFFFFF
WCAG 4.64:1 (AA) · APCA Lc 70
Contrast pairs
コードスニペット
CSS
:root {
--crossing-the-line: #e51445;
--crossing-the-line-rgb: 229 20 69;
--crossing-the-line-oklch: oklch(0.589 0.229 18.2);
}
.element {
color: var(--crossing-the-line);
background-color: hsl(346 84% 49%);
border-color: oklch(0.589 0.229 18.2);
}Tailwind CSS v4
@theme {
--color-crossing-the-line: #e51445;
--color-crossing-the-line-50: #ffdbda;
--color-crossing-the-line-100: #ffc9c8;
--color-crossing-the-line-200: #ffaaab;
--color-crossing-the-line-300: #ff8085;
--color-crossing-the-line-400: #ff5368;
--color-crossing-the-line-500: #f90047;
--color-crossing-the-line-600: #d2083d;
--color-crossing-the-line-700: #a90b30;
--color-crossing-the-line-800: #7f0425;
--color-crossing-the-line-900: #5a0519;
--color-crossing-the-line-950: #3c000a;
}SCSS
$crossing-the-line: #e51445;
$crossing-the-line-rgb: 229, 20, 69;
$crossing-the-line-light: mix(#fff, $crossing-the-line, 20%);
$crossing-the-line-dark: mix(#000, $crossing-the-line, 20%);
.element {
color: $crossing-the-line;
box-shadow: 0 0 0 2px rgba($crossing-the-line, 0.35);
}