色名 · #5A3D3F
Ancient Prunus
Ancient Prunusは#5A3D3F：rgb(90 61 63)、hsl(356 19% 30%)、oklch(0.394 0.041 14.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Ancient Prunus color name →
#5A3D3F
oklch(0.394 0.041 14.5)
カラー変換
- HEX
- #5a3d3f
- RGB
- rgb(90 61 63)
- HSL
- hsl(356 19% 30%)
- HWB
- hwb(356 24% 65%)
- OKLCH
- oklch(0.394 0.041 14.5)
- OKLab
- oklab(0.394 0.04 0.01)
- CIE Lab
- lab(29.21 13.36 4.16)
- LCH
- lch(29.21 13.99 17.3)
- CMYK
- cmyk(0% 32% 30% 65%)
ティント · シェード · トーン
ティント
- 6A4E50
- 796061
- 897274
- 998586
- AA9999
- BAACAD
- CBC0C1
- DCD5D5
- EEEAEA
シェード
- 4D3435
- 412B2C
- 352223
- 291A1B
- 1E1212
- 130A0A
- 090404
- 030101
- 000000
トーン
- 5E4345
- 624A4B
- 665152
- 6A5758
- 6E5E5F
- 716565
- 756B6C
- 797272
- 7C7979
カラーハーモニー
補色 +180°
- 5A3D3F
Ancient Prunus
- 2A4D4D
≈ Seagrass Green
類似色 -30° +30°
- 5A3D3F
Ancient Prunus
- 563D4B
≈ Dark Fig Violet
- 593F34
≈ Cordwood
トライアド +120° +240°
- 5A3D3F
Ancient Prunus
- 3D4B35
≈ Mountain View
- 37475C
≈ Compass Blue
スプリットコンプリメンタリー +150° +210°
- 5A3D3F
Ancient Prunus
- 304D40
≈ Pine Needle
- 2D4B57
≈ Deep Sea Blue
テトラード +90° +180° +270°
- 5A3D3F
Ancient Prunus
- 49472D
≈ Tin Bitz
- 2A4D4D
≈ Seagrass Green
- 43435C
≈ Darkest Navy
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 9.65:1 · APCA Lc 92
Ag
Fail黒の上
WCAG 2.17:1 · APCA Lc 10
最適な文字色: #FFFFFF
WCAG 9.65:1 (AAA) · APCA Lc 92
Contrast pairs
コードスニペット
CSS
:root {
--ancient-prunus: #5a3d3f;
--ancient-prunus-rgb: 90 61 63;
--ancient-prunus-oklch: oklch(0.394 0.041 14.5);
}
.element {
color: var(--ancient-prunus);
background-color: hsl(356 19% 30%);
border-color: oklch(0.394 0.041 14.5);
}Tailwind CSS v4
@theme {
--color-ancient-prunus: #5a3d3f;
--color-ancient-prunus-50: #fff1f1;
--color-ancient-prunus-100: #f5e3e3;
--color-ancient-prunus-200: #e5cece;
--color-ancient-prunus-300: #ccafb0;
--color-ancient-prunus-400: #b59597;
--color-ancient-prunus-500: #a07b7e;
--color-ancient-prunus-600: #87696a;
--color-ancient-prunus-700: #6c5455;
--color-ancient-prunus-800: #503d3e;
--color-ancient-prunus-900: #372a2b;
--color-ancient-prunus-950: #221718;
}SCSS
$ancient-prunus: #5a3d3f;
$ancient-prunus-rgb: 90, 61, 63;
$ancient-prunus-light: mix(#fff, $ancient-prunus, 20%);
$ancient-prunus-dark: mix(#000, $ancient-prunus, 20%);
.element {
color: $ancient-prunus;
box-shadow: 0 0 0 2px rgba($ancient-prunus, 0.35);
}