Our Mission & Philosophy

Colors that actually make sense for your project.

ihatecolors was created out of frustration with conventional color tools. We combine mathematical color theory, WCAG accessibility standards, multi-format code exports, and generative AI prompt engineering in one seamless platform.

Why We Built ihatecolors

If you've ever built a web application, brand identity, or mobile app, you know the dread: spending hours flipping through hundreds of random color swatches online, only to pick four colors that look okay together in isolation, but completely fall apart when applied to real buttons, text elements, cards, or dark mode surfaces.

Traditional color websites dump thousands of uncurated, user-submitted 5-color blocks onto the screen without answering the crucial questions every designer and developer faces:

  • Which hex code should be used for the main background versus the primary interactive button?
  • Does body text on this background pass WCAG 2.1 AA/AAA contrast standards for readability?
  • How do I format this palette directly into CSS Custom Properties (`:root`) or Tailwind CSS without manually copying hex codes one by one?
  • How can I prompt generative AI models (like Midjourney, ChatGPT, v0, or Cursor) to use these exact brand colors in generated UIs or graphics?

That is why we built ihatecolors — a suite of theory-aware color tools created specifically for developers, UI/UX designers, solopreneurs, and digital creators who want gorgeous, functional color systems in seconds rather than hours.

Our Four Core Pillars

Every tool, palette, and feature on ihatecolors is engineered around four non-negotiable principles.

01

Theory-Aware Harmonization

Every palette on our platform is evaluated against mathematical color harmony rules (analogous, complementary, triadic, split-complementary). We calculate hue angles, relative luminance, and CMYK/RGB values so your designs feel balanced and intentional across print and digital media.

02

Accessibility & WCAG First

Web accessibility is non-negotiable. Every palette detail page displays real-time WCAG 2.1 contrast ratios and AA/AAA compliance ratings. We test text-to-background contrast so your interfaces remain legible and compliant for all users.

03

1-Click Developer Code Exports

No more tedious copying of individual hex codes. Export complete color tokens instantly formatted for CSS custom properties (`:root`), Tailwind CSS config objects, Figma styles, and SCSS variables with one single click.

04

AI System & Prompt Integration

Modern design workflows rely on AI tools. Every palette generates a structured AI prompt specifying exact background, accent, and text roles, allowing you to feed exact color specifications directly into generative AI systems like Midjourney or ChatGPT.

How We Calculate Color Harmonies

Unlike static swatch collections, ihatecolors uses client-side algorithms (powered by chroma-js and custom color space conversion routines) to process colors in the HSL (Hue, Saturation, Lightness) and CIE L*a*b* perceptual color spaces.

When you generate or explore a palette:

  1. Dominant Hue Analysis: We extract the primary base color and determine its position on the 360° color wheel.
  2. Harmony Calculation: We generate complementary (180° offset), triadic (120° offsets), or analogous (15-30° offsets) companion shades.
  3. Perceptual Luminance Check: We calculate relative luminance (L = 0.2126 × R + 0.7152 × G + 0.0722 × B) to ensure sufficient visual separation between background and foreground elements.
  4. WCAG Contrast Evaluation: Contrast ratio (CR = (L1 + 0.05) / (L2 + 0.05)) is evaluated against WCAG 2.1 thresholds (4.5:1 for normal text, 3:1 for large text).

Our Editorial & Transparency Commitment

ihatecolors is independently maintained and funded primarily through non-intrusive advertisements provided by partners like Google AdSense. We do not place user data behind paywalls, sell personal information to third parties, or restrict access to code exports.

We adhere strictly to web accessibility standards, clean web design principles, and transparent data privacy practices. For details on how we handle cookies and privacy, please review our Privacy Policy and Terms of Service.

Have Questions or Suggestions?

We love hearing from designers, developers, and creators. Whether you have a feature request or need help with a palette, get in touch with our team.

Contact Us & Support →
Skip to content > le> >