最も近い色名 · #D6386F
#D6386F
最も近い色名: Dark Pink
#D6386F（rgb(214 56 111)、hsl(339 66% 53%)、oklch(0.593 0.197 4.7)）に最も近い色名はDark Pinkです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#D6386F
oklch(0.593 0.197 4.7)
カラー変換
- HEX
- #d6386f
- RGB
- rgb(214 56 111)
- HSL
- hsl(339 66% 53%)
- HWB
- hwb(339 22% 16%)
- OKLCH
- oklch(0.593 0.197 4.7)
- OKLab
- oklab(0.593 0.196 0.016)
- CIE Lab
- lab(50.41 63.93 7.39)
- LCH
- lch(50.41 64.35 6.6)
- CMYK
- cmyk(0% 74% 48% 16%)
ティント · シェード · トーン
ティント
- DD517C
- E3678A
- E97C98
- EE8FA6
- F3A2B4
- F7B5C3
- FAC7D2
- FCDAE1
- FEECF0
シェード
- BA2F60
- 9E2751
- 841F42
- 6A1734
- 520F27
- 3B081A
- 25040E
- 100104
- 020001
トーン
- CF4471
- C84E72
- C05774
- B85E76
- B06578
- A86B79
- 9F717B
- 95767D
- 8B7B7E
カラーハーモニー
補色 +180°
- D6386F
Dark Pink
- 009286
≈ Deep Peacock Blue
類似色 -30° +30°
- D6386F
Dark Pink
- C044AC
≈ Ultraviolet Nusp
- DA4017
≈ Torii Red
トライアド +120° +240°
- D6386F
Dark Pink
- 6B8C00
≈ Asparagus Sultan
- 0084CF
≈ Calgar Blue
スプリットコンプリメンタリー +150° +210°
- D6386F
Dark Pink
- 009755
≈ Garnish
- 008DA5
≈ Parrot Flight
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 4.51:1 · APCA Lc 70
Ag
AA黒の上
WCAG 4.65:1 · APCA Lc 32
最適な文字色: #000000
WCAG 4.65:1 (AA) · APCA Lc 32
Contrast pairs
コードスニペット
CSS
:root {
--dark-pink: #d6386f;
--dark-pink-rgb: 214 56 111;
--dark-pink-oklch: oklch(0.593 0.197 4.7);
}
.element {
color: var(--dark-pink);
background-color: hsl(339 66% 53%);
border-color: oklch(0.593 0.197 4.7);
}Tailwind CSS v4
@theme {
--color-dark-pink: #d6386f;
--color-dark-pink-50: #ffdeec;
--color-dark-pink-100: #ffcddd;
--color-dark-pink-200: #ffb0c6;
--color-dark-pink-300: #ff89a7;
--color-dark-pink-400: #f9628f;
--color-dark-pink-500: #e73475;
--color-dark-pink-600: #c32f63;
--color-dark-pink-700: #9d254f;
--color-dark-pink-800: #75193c;
--color-dark-pink-900: #521129;
--color-dark-pink-950: #370217;
}SCSS
$dark-pink: #d6386f;
$dark-pink-rgb: 214, 56, 111;
$dark-pink-light: mix(#fff, $dark-pink, 20%);
$dark-pink-dark: mix(#000, $dark-pink, 20%);
.element {
color: $dark-pink;
box-shadow: 0 0 0 2px rgba($dark-pink, 0.35);
}