Color Palette Preview
Preview your color palette applied to UI components.
Palette
Aperçu en contexte
Carte Hero
Visualisez vos couleurs appliquées à différents composants UI.
Notification
Message de succès avec accent
Badges colorés
Gradient preview
Supported formats
How it works
Add your colors
See them applied to UI components
Adjust and refine your palette
Privacy guaranteed
Your image is analyzed directly in your browser. No files are sent to our servers, ensuring complete privacy.
See Your Colors in Action
Preview your palette on realistic UI elements — buttons, cards, forms, navigation — to see exactly how your colors work together. Validate all your choices before integrating them into your final project.
Preview a palette in real-world conditions
Test your palette on a UI mockup including buttons, cards, forms and navigation. This preview helps you validate your choices before integrating colors into a final project.
UI mockup: buttons, cards, forms
The mockup covers the most common components of a modern interface. You instantly see how the palette behaves on CTAs, neutral backgrounds, borders and hover states.
Compare several palettes side by side
Display several palette variants in parallel to compare rendering and pick the one best suited to your project. Very useful during exploration or client-presentation phases.
Mobile, tablet and desktop preview
Switch between screen sizes to validate your palette's readability on mobile, tablet and desktop. Contrasts don't always behave the same way across devices.
Free tool to iterate quickly
The preview is instant and entirely free. Tweak a color and the mockup updates in real time: an ideal workflow to iterate on a design system without installing any software.