# Color Theme

## (AI generated) Description

The sketch programmatically generates a harmonious color theme across a series of vertical bars, each representing different color schemes based on a primary color chosen by the user. The outcome is a visual representation of color theory principles applied through coding, with each run producing a unique theme. Features include:

- A canvas of `400x225 pixels`.
- Four distinct vertical bars filled with colors from different schemes:
  - Analogous
  - Complementary
  - Triadic
  - Tetradic
- An interactive component where the 'S' key saves the current theme.
- Randomized color themes with control via `randomSeed`.
- Exploration of color properties such as hue, saturation, and brightness.

The sketch is aimed at showcasing color relationships and providing visual inspiration for color theme selection. Additionally, the project suggests experimenting with `lerpColor` for intermediate color values and encourages the creation of themes characterized by warmth, coldness, sweetness, fluffiness, etc

## Instructions

See https://www.canva.com/colors/color-wheel/ to get some ideas what it means to have, complementary, monochromatic, analogous, triadic tetradic colors.

Develop your own color themes that have a primary color of your liking and create a harmonic set of colors that depend on them using different color schemas:

- Create a [analogous color schema][analogous]
- Create a [complementary color schema][complementary]
- Create a [triadic color schema][triadic]
- Create a [tetradic color schema][tetradic]
- Create a own color schema for example like these ideas: https://cloud.typingmind.com/share/000461df-80c2-4728-8cac-cf5cc5cd26d2
- Arrange them in one sketch
- Make sure you can create new themes in each program run. Control the `random` using `randomSeed`

Also Try to make your themes:

- warm
- cold
- sweat
- fluffy
- tbd

What about Shades, tints and tones?
Don't be boring like me give it some meaningful form.

Relevant links are:

- `colorMode` https://p5js.org/reference/#/p5/colorMode
- `color` https://p5js.org/reference/#/p5/color
- `hue` https://p5js.org/reference/#/p5/hue
- `saturation` https://p5js.org/reference/#/p5/saturation
- `brightness` https://p5js.org/reference/#/p5/brightness
- `red` https://p5js.org/reference/#/p5/red
- `green` https://p5js.org/reference/#/p5/green
- `blue` https://p5js.org/reference/#/p5/blue
- `randomSeed` https://p5js.org/reference/#/p5/randomSeed

## Bonus Task

- Explore `lerpColor` https://p5js.org/reference/#/p5/lerpColor

---

[analogous]: https://www.colorpsychology.org/analogous-colors/
[complementary]: https://en.wikipedia.org/wiki/Complementary_colors
[triadic]: https://en.wikipedia.org/wiki/Color_scheme#Triadic
[tetradic]: https://en.wikipedia.org/wiki/Color_scheme#Tetradic