ColorMeUp LAB
A design tool for creating and fine-tuning perceptual color scales.
It’s built for designers and developers who need control over how a color scale behaves — not a palette of swatches, but one color in every tone you need. You shape it directly and see the impact of each adjustment in real time.
All calculations are done in the OKLCH color space, which makes it easier to reason about lightness and chroma independently and to generate scales that behave consistently across steps and different displays. This is especially important for UI work, where uneven jumps quickly become noticeable.
What you can do
Shape the scale
Lightness range and curve, chroma curve, hue shift, and 3–20 steps, in light, dark or reversed mode. Lock any step to anchor the ramp.
Any color can carry its own curves, range, steps or mode, without touching the rest.
Check contrast
Every step is measured with both WCAG and APCA, with a grid for pairing foreground and background steps.
Preview it on real UI
Put the palette onto buttons, cards, charts and typography, in light and dark, instead of judging swatches in isolation.
See the curves
Lightness, chroma and hue are plotted, so uneven jumps are visible instead of guessed at.
Start with presets
Tailwind, Material, Bootstrap and Open Color presets reproduce how those systems distribute lightness and chroma.
Build multiple scales
Up to ten colors, grouped as brand, neutral, semantic or decorative; kept in wide-gamut P3 where the display supports it.
Export it
Tailwind 3 and 4, CSS, SCSS and SVG, in the color format you work in. One scale or the whole palette.
Share it
Colors and settings both live in the URL, so sharing is copying the address bar. Signing in only adds saving.
See Custom Color Scales to learn how to shape your own.
Accessible and open by design
Many tools expose parts of this workflow, but rarely all of it in one place. Others lock more precise controls behind subscriptions, which doesn’t always make sense for designers and developers who only need this level of control occasionally.
The goal here is to keep these controls available by default. This is a public, evolving tool you can return to when needed, without committing to a subscription or adapting your workflow around artificial limitations.
Feedback is welcome, and the project is intentionally open. It’s a lab in the literal sense: a space to experiment with color, test assumptions, and refine how scales are built.
Check out the repo at github.com/gilbarbara/color-lab
ColorMeUp and colorizr
Alongside this app, there’s also the original ColorMeUp app. It’s a more exploratory tool, focused on inspecting colors, formats, and variations, and experimenting with different color models.
Both apps are open source and built on top of colorizr, a shared library that handles perceptual color logic and scale generation. colorizr can also be used directly in code, independently of either UI.
That's it. Jump into the generator, tweak your scales, and explore a bit. If you find it useful, starring the repos is appreciated.