Yohann Durand

WPStylo - Visual Design System Configurator for WordPress

byβ€’
WPStylo β€” Design systems for WordPress, made visual. Build your design system in minutes: colors, typography, buttons & global tokens, all configured visually with a live preview. Export clean CSS custom properties or a portable config file. The free companion plugin applies everything straight to your site: Elementor, Full Site Editing, or CSS variables. No code, no guesswork. Ship a consistent, on-brand WordPress site, fast.

Add a comment

Replies

Best
Yohann Durand
Maker
πŸ“Œ
Hey Product Hunt πŸ‘‹ I'm Yohann, a freelance WordPress developer based in Lyon, France. WPStylo came straight out of my own frustration. On every client project, I'd find myself doing the same thing: defining colors, type scales and button styles… then manually re-entering all of it into Elementor, theme.json or raw CSS - hand-copying hex codes, recalculating clamp() values, and praying everything stayed consistent. It was slow, error-prone, and honestly a bit soul-crushing. So I built the tool I wished I had: configure your whole design system visually, see it live, then export it. The free companion plugin does the boring part : it pushes those tokens directly into WordPress, whether you use Elementor, Full Site Editing, or plain CSS variables. The biggest shift while building it was realizing the configurator alone wasn't enough. The magic only clicks when the design system actually lands in WordPress without copy-pasting. That's why the companion plugin became just as important as the app itself. It's still early and I'd love your honest feedback - especially from fellow WordPress builders. What would make this genuinely useful in your workflow? πŸ™