色名 · #CA9FA5
Primula
Primulaは#CA9FA5：rgb(202 159 165)、hsl(352 29% 71%)、oklch(0.744 0.052 9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Primula color name →
#CA9FA5
oklch(0.744 0.052 9)
カラー変換
- HEX
- #ca9fa5
- RGB
- rgb(202 159 165)
- HSL
- hsl(352 29% 71%)
- HWB
- hwb(352 62% 21%)
- OKLCH
- oklch(0.744 0.052 9)
- OKLab
- oklab(0.744 0.051 0.008)
- CIE Lab
- lab(69.67 17.11 3.3)
- LCH
- lch(69.67 17.43 10.9)
- CMYK
- cmyk(0% 21% 18% 21%)
ティント · シェード · トーン
ティント
- D0A8AE
- D5B2B6
- DABBBF
- E0C5C8
- E5CED1
- EAD8DA
- F0E2E3
- F5EBEC
- FAF5F6
シェード
- AF8A8F
- 957579
- 7C6165
- 644D51
- 4D3B3D
- 37292B
- 22181A
- 0F090A
- 020101
トーン
- C39CA1
- BB999D
- B4969A
- AC9396
- A59092
- 9D8C8F
- 96898B
- 8F8687
- 878384
カラーハーモニー
補色 +180°
- CA9FA5
Primula
- 87B7B2
≈ Vintage Blue
類似色 -30° +30°
- CA9FA5
Primula
- C3A0B7
≈ Pretty Lady
- CAA194
≈ Raspberry Kahlua
トライアド +120° +240°
- CA9FA5
Primula
- A2B390
≈ Soap Green
- 93AFCC
≈ Chambray Blue
スプリットコンプリメンタリー +150° +210°
- CA9FA5
Primula
- 91B6A0
≈ Garden District
- 88B4C2
≈ Crystal Lake
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.32:1 · APCA Lc 46
Ag
AAA黒の上
WCAG 9.01:1 · APCA Lc 56
最適な文字色: #000000
WCAG 9.01:1 (AAA) · APCA Lc 56
Contrast pairs
コードスニペット
CSS
:root {
--primula: #ca9fa5;
--primula-rgb: 202 159 165;
--primula-oklch: oklch(0.744 0.052 9);
}
.element {
color: var(--primula);
background-color: hsl(352 29% 71%);
border-color: oklch(0.744 0.052 9);
}Tailwind CSS v4
@theme {
--color-primula: #ca9fa5;
--color-primula-50: #ffeff1;
--color-primula-100: #f9e1e3;
--color-primula-200: #e9cccf;
--color-primula-300: #d0adb1;
--color-primula-400: #bb9298;
--color-primula-500: #a5787f;
--color-primula-600: #8b666b;
--color-primula-700: #705156;
--color-primula-800: #523b3f;
--color-primula-900: #39292b;
--color-primula-950: #241619;
}SCSS
$primula: #ca9fa5;
$primula-rgb: 202, 159, 165;
$primula-light: mix(#fff, $primula, 20%);
$primula-dark: mix(#000, $primula, 20%);
.element {
color: $primula;
box-shadow: 0 0 0 2px rgba($primula, 0.35);
}