CSS Utilities
--color-carbon-fiber: #1C1C1C;
.bg-carbon-fiber { background-color: #1C1C1C; }
.text-carbon-fiber { color: #1C1C1C; }Machine-readable data
Machine-Readable Color Data (JSON)
Perfect for CSS, design systems, automation, and AI ingestion.
hexCanonical HEX valuergbRed, green, blue channelshslHue, saturation, lightnesscmykApproximate print conversionwcagAA and AAA contrast optionsharmoniesMathematical harmony setsvariantsGenerated tone variantsnearestColorsKnowledge graph neighborsStructured sections
Color systems
{
"hex": "#1C1C1C",
"rgb": [
28,
28,
28
],
"hsl": [
0,
0,
11
],
"cmyk": [
0,
0,
0,
89
],
"luminance": 0.0116,
"contrast": {
"black": 1.23,
"white": 17.05
}
}WCAG
{
"AA": [
"#FFFFFF",
"#F5F5F5"
],
"AAA": [
"#FFFFFF",
"#F5F5F5"
]
}Harmonies
{
"complementary": "#1C1C1C",
"analogous": [
"#1C1C1C",
"#1C1C1C"
],
"triadic": [
"#1C1C1C",
"#1C1C1C"
],
"tetradic": [
"#1C1C1C",
"#1C1C1C",
"#1C1C1C"
],
"splitComplementary": [
"#1C1C1C",
"#1C1C1C"
],
"monochromatic": [
"#4A4A4A",
"#1C1C1C",
"#000000"
]
}Variants
{
"light": "#4A4A4A",
"dark": "#000000",
"saturated": "#221616",
"desaturated": "#1C1C1C",
"pastel": "#5C5C5C",
"neon": "#610000"
}Pairings
{
"best": [
"#FFFFFF",
"#1C1C1C",
"#1C1C1C",
"#1C1C1C"
],
"avoid": [
"#1C1C1C",
"#4A4A4A"
],
"neutral": [
"#1A1A1A",
"#F5F5F5",
"#E8E8E4"
],
"highContrast": [
"#FFFFFF"
],
"lowContrast": [
"#4A4A4A",
"#1C1C1C"
]
}Knowledge graph
{
"nearestColors": [
"matte-black",
"raisin",
"rubber",
"slate-black",
"asphalt"
],
"generatedPalettes": [
"carbon-fiber"
],
"generatedComparisons": [
"carbon-fiber-vs-matte-black",
"carbon-fiber-vs-raisin"
],
"relatedFamilies": [
"/colors/by-family/gray",
"/colors/by-temperature/neutral",
"/colors/by-tone/dark"
],
"relatedTools": [
"/harmonies/carbon-fiber",
"/wcag/carbon-fiber",
"/css/colors/carbon-fiber",
"/hex/1c1c1c"
],
"semanticRelations": {
"broader": [
"/colors/by-family/gray",
"/colors/by-temperature/neutral",
"/colors/by-tone/dark"
],
"narrower": [
"/palettes/carbon-fiber"
],
"related": [
"/colors/matte-black",
"/colors/raisin",
"/colors/rubber",
"/colors/slate-black",
"/colors/asphalt",
"/compare/carbon-fiber-vs-matte-black",
"/compare/carbon-fiber-vs-raisin",
"/harmonies/carbon-fiber",
"/wcag/carbon-fiber",
"/css/colors/carbon-fiber",
"/hex/1c1c1c"
]
}
}Full JSON dataset
{
"slug": "carbon-fiber",
"name": "Carbon Fiber",
"hex": "#1C1C1C",
"uses": [
"industrial design",
"safety systems",
"hardware palettes"
],
"psychology": {
"associations": [
"utility",
"visibility",
"precision"
],
"contexts": [
"transportation",
"tools",
"hardware",
"signage"
],
"avoidIn": [
"soft wellness palettes"
]
},
"aliases": [],
"sourceType": "curated",
"confidence": "medium",
"reviewStatus": "manual",
"sourceUrl": "https://www.colorsencyclopedia.com/assets/colors.json",
"origin": {
"type": "common",
"notes": "Curated common color reference used in design, material, cultural, and editorial color systems."
},
"family": "gray",
"temperature": "neutral",
"tone": [
"dark"
],
"editorialNotes": "Curated internal color record with computed technical properties.",
"tags": [
"gray",
"neutral",
"dark",
"industrial-design",
"safety-systems",
"hardware-palettes",
"utility",
"visibility",
"precision"
],
"popularity": 84,
"rgb": [
28,
28,
28
],
"hsl": [
0,
0,
11
],
"cmyk": [
0,
0,
0,
89
],
"luminance": 0.0116,
"contrast": {
"black": 1.23,
"white": 17.05
},
"harmonies": {
"complementary": "#1C1C1C",
"analogous": [
"#1C1C1C",
"#1C1C1C"
],
"triadic": [
"#1C1C1C",
"#1C1C1C"
],
"tetradic": [
"#1C1C1C",
"#1C1C1C",
"#1C1C1C"
],
"splitComplementary": [
"#1C1C1C",
"#1C1C1C"
],
"monochromatic": [
"#4A4A4A",
"#1C1C1C",
"#000000"
]
},
"variants": {
"light": "#4A4A4A",
"dark": "#000000",
"saturated": "#221616",
"desaturated": "#1C1C1C",
"pastel": "#5C5C5C",
"neon": "#610000"
},
"wcag": {
"AA": [
"#FFFFFF",
"#F5F5F5"
],
"AAA": [
"#FFFFFF",
"#F5F5F5"
]
},
"css": {
"variable": "--color-carbon-fiber: #1C1C1C;",
"utility": ".bg-carbon-fiber { background-color: #1C1C1C; }",
"textUtility": ".text-carbon-fiber { color: #1C1C1C; }"
},
"nearestColors": [
"matte-black",
"raisin",
"rubber",
"slate-black",
"asphalt"
],
"generatedPalettes": [
"carbon-fiber"
],
"generatedComparisons": [
"carbon-fiber-vs-matte-black",
"carbon-fiber-vs-raisin"
],
"relatedFamilies": [
"/colors/by-family/gray",
"/colors/by-temperature/neutral",
"/colors/by-tone/dark"
],
"relatedTools": [
"/harmonies/carbon-fiber",
"/wcag/carbon-fiber",
"/css/colors/carbon-fiber",
"/hex/1c1c1c"
],
"semanticRelations": {
"broader": [
"/colors/by-family/gray",
"/colors/by-temperature/neutral",
"/colors/by-tone/dark"
],
"narrower": [
"/palettes/carbon-fiber"
],
"related": [
"/colors/matte-black",
"/colors/raisin",
"/colors/rubber",
"/colors/slate-black",
"/colors/asphalt",
"/compare/carbon-fiber-vs-matte-black",
"/compare/carbon-fiber-vs-raisin",
"/harmonies/carbon-fiber",
"/wcag/carbon-fiber",
"/css/colors/carbon-fiber",
"/hex/1c1c1c"
]
},
"pairings": {
"best": [
"#FFFFFF",
"#1C1C1C",
"#1C1C1C",
"#1C1C1C"
],
"avoid": [
"#1C1C1C",
"#4A4A4A"
],
"neutral": [
"#1A1A1A",
"#F5F5F5",
"#E8E8E4"
],
"highContrast": [
"#FFFFFF"
],
"lowContrast": [
"#4A4A4A",
"#1C1C1C"
]
}
}
Color meaning and use
About Carbon Fiber Color
Carbon Fiber sits in the gray family with neutral temperature and dark visual character. Carbon Fiber is a commonly used color name in design references, palettes, and editorial color systems.
Its common associations include utility, visibility, and precision, which makes it relevant for transportation and tools. In design work, Carbon Fiber is most useful for industrial design, safety systems, and hardware palettes, especially when paired with white text for stronger contrast.
WCAG Accessibility
Contrast checks for Carbon Fiber against black and white text.