DEV Community

Bajro
Bajro

Posted on • Edited on

4 2

Simplest color scheme generator in Vuejs

I try to make the simplest color generator with JavaScript.
My understanding of the generator is that it works most of the time with HSL color representation. It is mostly for me to practice conversions between colors.

I first convert hex color to RGB color by taking input and take first 2 characters to represent Red value than next 2 characters represent Green value and last 2 character is Blue value. After that, I take RGB color and convert it to HSL I found Here. In the end, I just take the HSL value and change the L(lightness) value if I want darker color I subtract some value and if I want lighter color I add some value.
You can check how it looks like and plays a little with it on my codepen.
In the next few days, I will try to recreate Adobe color.

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read full post →

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more