色名 · #C1775E
Warm Terra Cotta
Warm Terra Cottaは#C1775E：rgb(193 119 94)、hsl(15 44% 56%)、oklch(0.643 0.1 39.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Warm Terra Cotta color name →
#C1775E
oklch(0.643 0.1 39.4)
カラー変換
- HEX
- #c1775e
- RGB
- rgb(193 119 94)
- HSL
- hsl(15 44% 56%)
- HWB
- hwb(15 37% 24%)
- OKLCH
- oklch(0.643 0.1 39.4)
- OKLab
- oklab(0.643 0.078 0.064)
- CIE Lab
- lab(57.82 27.85 26.59)
- LCH
- lch(57.82 38.5 43.7)
- CMYK
- cmyk(0% 38% 51% 24%)
ティント · シェード · トーン
ティント
- C8846E
- CF927D
- D69F8D
- DCAD9D
- E2BAAD
- E9C8BD
- EED6CD
- F4E3DE
- FAF1EE
シェード
- A76751
- 8F5744
- 774737
- 5F382B
- 492A1F
- 341C14
- 20100A
- 0E0503
- 020100
トーン
- BB7862
- B57A66
- AF7B69
- A87C6D
- A27D70
- 9B7E74
- 957E77
- 8E7F7A
- 87807D
カラーハーモニー
補色 +180°
- C1775E
Warm Terra Cotta
- 349BB7
≈ Sports Blue
類似色 -30° +30°
- C1775E
Warm Terra Cotta
- C17280
≈ Briar Rose
- B48144
≈ Tiffany Amber
トライアド +120° +240°
- C1775E
Warm Terra Cotta
- 50A077
≈ Advertising Green
- 8086C9
≈ True Lavender
スプリットコンプリメンタリー +150° +210°
- C1775E
Warm Terra Cotta
- 2BA09A
≈ Sea Kale
- 5B91C8
≈ Come Sail Away
テトラード +90° +180° +270°
- C1775E
Warm Terra Cotta
- 799956
≈ Dry Moss
- 349BB7
≈ Sports Blue
- 9F7CBB
≈ Lush Lilac
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.46:1 · APCA Lc 62
Ag
AA黒の上
WCAG 6.06:1 · APCA Lc 40
最適な文字色: #000000
WCAG 6.06:1 (AA) · APCA Lc 40
Contrast pairs
コードスニペット
CSS
:root {
--warm-terra-cotta: #c1775e;
--warm-terra-cotta-rgb: 193 119 94;
--warm-terra-cotta-oklch: oklch(0.643 0.1 39.4);
}
.element {
color: var(--warm-terra-cotta);
background-color: hsl(15 44% 56%);
border-color: oklch(0.643 0.1 39.4);
}Tailwind CSS v4
@theme {
--color-warm-terra-cotta: #c1775e;
--color-warm-terra-cotta-50: #ffecdf;
--color-warm-terra-cotta-100: #ffdece;
--color-warm-terra-cotta-200: #fbc7b3;
--color-warm-terra-cotta-300: #e4a790;
--color-warm-terra-cotta-400: #d28a71;
--color-warm-terra-cotta-500: #be6d52;
--color-warm-terra-cotta-600: #a15d46;
--color-warm-terra-cotta-700: #814a38;
--color-warm-terra-cotta-800: #603528;
--color-warm-terra-cotta-900: #43241b;
--color-warm-terra-cotta-950: #2b130c;
}SCSS
$warm-terra-cotta: #c1775e;
$warm-terra-cotta-rgb: 193, 119, 94;
$warm-terra-cotta-light: mix(#fff, $warm-terra-cotta, 20%);
$warm-terra-cotta-dark: mix(#000, $warm-terra-cotta, 20%);
.element {
color: $warm-terra-cotta;
box-shadow: 0 0 0 2px rgba($warm-terra-cotta, 0.35);
}