Iris — The Art of Color.

Finding the right colors can be frustrating and time-consuming. Iris makes it effortless — generating timeless, harmonious palettes that bring elegance and balance to every design.

Comment

Inspiration

What it does

How we built it

Challenges we ran into

Accomplishments that we're proud of

What we learned

What's next for Iris — The Art of Color.

Inspiration

The idea for Iris came from the challenge many creators face: finding the perfect blend of colors.
Whether for design, art, or digital projects, choosing harmonious palettes can be time-consuming and often frustrating.
I wanted to create a tool that makes this process simple, elegant, and inspiring — drawing from the myth of Iris, the Greek goddess of the rainbow.

What it does

Iris — The Art of Color is a palette generator that creates timeless, balanced hues with just a few clicks.
It helps designers, artists, and developers explore harmony in color, turning ideas into works of art.

How we built it

I built Iris using React.js for the frontend and styled it with Tailwind CSS for a sleek, responsive interface.
The color generation logic relies on mathematical manipulation of color models like HSL (Hue, Saturation, Lightness), ensuring consistency and harmony:

$$ H = (H + \Delta H) \mod 360 $$
$$ S = S \pm \Delta S, \quad L = L \pm \Delta L $$

This allows dynamic palette creation while maintaining balance between tones.

Challenges we ran into

  • Ensuring palettes remained visually harmonious across multiple color modes.
  • Balancing minimal UI with functionality.
  • Fine-tuning the algorithm for consistency in contrast and accessibility compliance.

Accomplishments that we're proud of

  • A smooth, intuitive interface that feels artistic and professional.
  • Implementing color harmony rules (complementary, analogous, triadic).
  • Bridging mythology, art, and technology into one elegant tool.

What we learned

  • The importance of color theory in user experience.
  • Advanced handling of HSL and RGB models.
  • How subtle UI choices (spacing, typography, animations) dramatically improve usability.

What's next for Iris

  • Adding AI-assisted palette suggestions based on uploaded images.
  • Exporting palettes directly into design tools like Figma or Adobe XD.
  • Enabling collaboration, where teams can share and rate palettes.

Built With

Share this project:

Updates