色名 · #DA467D
Pickled Pink
Pickled Pinkは#DA467D：rgb(218 70 125)、hsl(338 67% 56%)、oklch(0.617 0.189 1.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Pickled Pink color name →
#DA467D
oklch(0.617 0.189 1.7)
カラー変換
- HEX
- #da467d
- RGB
- rgb(218 70 125)
- HSL
- hsl(338 67% 56%)
- HWB
- hwb(338 27% 15%)
- OKLCH
- oklch(0.617 0.189 1.7)
- OKLab
- oklab(0.617 0.189 0.005)
- CIE Lab
- lab(53.2 61.29 3.04)
- LCH
- lch(53.2 61.36 2.8)
- CMYK
- cmyk(0% 68% 43% 15%)
ティント · シェード · トーン
ティント
- E05C89
- E67096
- EB83A2
- F095AF
- F4A7BC
- F8B9C9
- FACAD6
- FDDCE4
- FEEDF1
シェード
- BD3C6C
- A2325B
- 87284B
- 6C1E3B
- 54152C
- 3C0D1E
- 250511
- 110205
- 020001
トーン
- D24F7D
- CA577E
- C25E7E
- BA647E
- B16A7F
- A86F7F
- 9F747F
- 95787F
- 8B7C80
カラーハーモニー
補色 +180°
- DA467D
Pickled Pink
- 009A8A
≈ Santorini Seascape
類似色 -30° +30°
- DA467D
Pickled Pink
- C251B7
≈ Still Fuchsia
- E04B34
≈ Sour Cherry
トライアド +120° +240°
- DA467D
Pickled Pink
- 779200
≈ Canopy
- 008DD4
≈ Zürich Blue
スプリットコンプリメンタリー +150° +210°
- DA467D
Pickled Pink
- 00A050
≈ Link Green
- 0096AA
≈ Brilliant
テトラード +90° +180° +270°
- DA467D
Pickled Pink
- A18100
≈ Pestilence
- 009A8A
≈ Santorini Seascape
- 5F77F5
≈ Pan Purple
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.07:1 · APCA Lc 67
Ag
AA黒の上
WCAG 5.15:1 · APCA Lc 35
最適な文字色: #000000
WCAG 5.15:1 (AA) · APCA Lc 35
Contrast pairs
コードスニペット
CSS
:root {
--pickled-pink: #da467d;
--pickled-pink-rgb: 218 70 125;
--pickled-pink-oklch: oklch(0.617 0.189 1.7);
}
.element {
color: var(--pickled-pink);
background-color: hsl(338 67% 56%);
border-color: oklch(0.617 0.189 1.7);
}Tailwind CSS v4
@theme {
--color-pickled-pink: #da467d;
--color-pickled-pink-50: #ffdfef;
--color-pickled-pink-100: #ffcee1;
--color-pickled-pink-200: #ffb2cb;
--color-pickled-pink-300: #ff8bad;
--color-pickled-pink-400: #f46696;
--color-pickled-pink-500: #e23b7d;
--color-pickled-pink-600: #bf346a;
--color-pickled-pink-700: #9a2a55;
--color-pickled-pink-800: #721d40;
--color-pickled-pink-900: #51132c;
--color-pickled-pink-950: #350419;
}SCSS
$pickled-pink: #da467d;
$pickled-pink-rgb: 218, 70, 125;
$pickled-pink-light: mix(#fff, $pickled-pink, 20%);
$pickled-pink-dark: mix(#000, $pickled-pink, 20%);
.element {
color: $pickled-pink;
box-shadow: 0 0 0 2px rgba($pickled-pink, 0.35);
}