Theme Playground
Make It Yours
Every SDK module adapts to your brand. Pick a preset, customize colors, fonts, and shapes — then copy the CSS to your site.
Live PreviewChanges apply to all SDK modules below
Product Grid
Product Slider
Search
Newsletter
Collection Browser
Apply to Your Site
Click “Copy CSS” and paste the CSS variables into your stylesheet. Every Chameleon SDK module will automatically adapt to your theme.
/* Add to your site's CSS */
:root {
--chm-primary: #10b981;
--chm-accent: #34d399;
--chm-bg: #1a1a2e;
--chm-text: #f0f0f5;
--chm-surface: #252540;
--chm-font: 'Inter', sans-serif;
--chm-radius: 0.5rem;
}
:root {
--chm-primary: #10b981;
--chm-accent: #34d399;
--chm-bg: #1a1a2e;
--chm-text: #f0f0f5;
--chm-surface: #252540;
--chm-font: 'Inter', sans-serif;
--chm-radius: 0.5rem;
}