Weirdcore Color Psychology & Meaning
Weirdcore is internet alienation made aesthetic — uncanny valley pastel colors that feel almost right but slightly wrong. Liminal space energy.
#C8A2C8
#FF6EC7
#7B2FBE
#1A1A1A
Background
Primary Accent
Secondary
Body Text
Weirdcore
vibrantnightmoody autumnwinter brandingsocial
AAA
WCAG Grade
7.8:1
Contrast Ratio
2,102
Saves
5,623
AI Copies
Use #C8A2C8 as the background. Use #FF6EC7 as the primary accent. Use #7B2FBE as secondary. Use #1A1A1A as body text/supporting color. Palette mood: Weirdcore — vibrant, night, moody.
Hex Codes, RGB & CMYK Color Values
Technical breakdown for the Weirdcore color scheme. Use these values for web design (HEX/RGB), print projects (CMYK), or specialized design software (HSL).
| Swatch | Design Role | HEX | RGB | CMYK | HSL |
|---|---|---|---|---|---|
| Background Luminance: 42.3% | 200, 162, 200 | 0%, 19%, 0%, 22% | 300°, 26%, 71% | ||
| Primary Accent Luminance: 36.5% | 255, 110, 199 | 0%, 57%, 22%, 0% | 323°, 100%, 72% | ||
| Secondary Luminance: 10.0% | 123, 47, 190 | 35%, 75%, 0%, 25% | 272°, 60%, 46% | ||
| Body Text Luminance: 1.0% | 26, 26, 26 | 0%, 0%, 0%, 90% | 0°, 0%, 10% |
Color Harmony: Triadic Scheme
The Weirdcore palette is built using a triadic relationship between its hues. This ensures that even with high-contrast accents, the overall scheme feels balanced and intentional.
Hue Wheel
A triadic palette is often preferred by professional designers because it balances visual interest with cohesion.
History & Design Context
Weirdcore emerged on Tumblr and TikTok as an aesthetic about disorientation, childhood trauma, and the feeling of being between places. Heavily influenced by early internet graphics.
Best Design Use Cases
Dark near-black for the disorienting base. Lilac for the almost-comfortable color. Hot pink for the uncanny accent. Purple for depth.
Industries This Palette Suits
Alternative, art, internet culture, edgy brands.
How to Implement the Weirdcore Color Scheme
To use this Weirdcore color palette in your web project, you can copy the following CSS variables or Tailwind CSS configuration. These roles ensure your UI maintains accessibility and visual hierarchy.
Option 1: CSS Variables
:root {
/* {name} Palette - ihatecolors.com */{'
'} --color-bg: {colors[0]};{'
'} --color-primary: {colors[1]};{'
'} --color-secondary: {colors[2]};{'
'} --color-text: {colors[3]};{'
'} {'}'}Web Design Tip
Use #C8A2C8 for the main background and #FF6EC7 for primary buttons. This creates a high-contrast focal point.
Accessibility Note
The contrast ratio between #1A1A1A and #C8A2C8 is 7.84:1 (AAA). Ensure your body text remains legible.