色名 · #CD5F42
Arabesque
Arabesqueは#CD5F42：rgb(205 95 66)、hsl(13 58% 53%)、oklch(0.615 0.147 35.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Arabesque color name →
#CD5F42
oklch(0.615 0.147 35.8)
カラー変換
- HEX
- #cd5f42
- RGB
- rgb(205 95 66)
- HSL
- hsl(13 58% 53%)
- HWB
- hwb(13 26% 20%)
- OKLCH
- oklch(0.615 0.147 35.8)
- OKLab
- oklab(0.615 0.119 0.086)
- CIE Lab
- lab(54.15 43.1 38.17)
- LCH
- lch(54.15 57.57 41.5)
- CMYK
- cmyk(0% 54% 68% 20%)
ティント · シェード · トーン
ティント
- D47055
- DA8068
- E0907B
- E6A08D
- EBB0A0
- F0C0B3
- F4CFC5
- F8DFD8
- FCEFEC
シェード
- B25238
- 98442F
- 7E3825
- 662C1C
- 4E2014
- 38150B
- 230A05
- 0F0301
- 020000
トーン
- C6644A
- BF6851
- B86C57
- B16F5E
- A97364
- A2766A
- 9A7970
- 927B75
- 897E7B
カラーハーモニー
補色 +180°
- CD5F42
Arabesque
- 0094AE
≈ Munsell Blue
類似色 -30° +30°
- CD5F42
Arabesque
- CB5977
≈ Strawberry Moon
- BB7100
≈ Sweet Mulled Cider
トライアド +120° +240°
- CD5F42
Arabesque
- 0E9E5D
≈ Shamrock
- 6E7ADB
≈ Kickstart Purple
スプリットコンプリメンタリー +150° +210°
- CD5F42
Arabesque
- 00998E
≈ Green Dynasty
- 1F8BD7
≈ Blue Cola
テトラード +90° +180° +270°
- CD5F42
Arabesque
- 6F931A
≈ Canopy
- 0094AE
≈ Munsell Blue
- 9B6ACA
≈ Amethyst
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.95:1 · APCA Lc 66
Ag
AA黒の上
WCAG 5.31:1 · APCA Lc 35
最適な文字色: #000000
WCAG 5.31:1 (AA) · APCA Lc 35
Contrast pairs
コードスニペット
CSS
:root {
--arabesque: #cd5f42;
--arabesque-rgb: 205 95 66;
--arabesque-oklch: oklch(0.615 0.147 35.8);
}
.element {
color: var(--arabesque);
background-color: hsl(13 58% 53%);
border-color: oklch(0.615 0.147 35.8);
}Tailwind CSS v4
@theme {
--color-arabesque: #cd5f42;
--color-arabesque-50: #ffe8d7;
--color-arabesque-100: #ffd8c5;
--color-arabesque-200: #ffbfa7;
--color-arabesque-300: #f89c80;
--color-arabesque-400: #e77c5f;
--color-arabesque-500: #d55b3b;
--color-arabesque-600: #b44e33;
--color-arabesque-700: #903e28;
--color-arabesque-800: #6c2c1e;
--color-arabesque-900: #4c1e13;
--color-arabesque-950: #320d06;
}SCSS
$arabesque: #cd5f42;
$arabesque-rgb: 205, 95, 66;
$arabesque-light: mix(#fff, $arabesque, 20%);
$arabesque-dark: mix(#000, $arabesque, 20%);
.element {
color: $arabesque;
box-shadow: 0 0 0 2px rgba($arabesque, 0.35);
}