BreakMade Design System
Elevate your Breakdance design with our framework featuring Color Palettes, Fluid Typography, Spacing Variables, and Flexible Buttons - all perfectly synced with Breakdance
Synced with Breakdance
Automatically generated rich 5 color palette with semantic shades.
Perfectly aligned right inside your Breakdance editor.
Each color gets
ready to use in your Breakdance editor!
Text & Heading Presets
Responsive typography that scales with screen size.
Utilize the power of Breakdance with predefined presets.
Spacing & Radius Variables
Consistent spacing and border radius across your entire design.
CSS variables ready to use for any purpose. Element Spacing (1 = 4px).
xl, xxl are for large screens
Drag & Drop Button System
Easily customize buttons with our Breakdance addon.
Just drag, drop, and select your perfect button style.
Choose from 4 button types to match your design needs. Each type provides a different visual emphasis.
Express meaning with 5 color options that convey different purposes and create visual hierarchy.
Choose from 3 size options to fit your layout needs and create visual hierarchy.
Enhance your buttons with icons to improve clarity and visual appeal. Position icons on left, right, or use icon-only buttons.
Ready-Made Blocks
Access 100+ pre-designed blocks to build your website in minutes instead of hours.
Proper Color System
Implement a consistent, accessible color palette across your entire site with our intelligent color system.
Fluid Typography
Text that automatically scales between screen sizes for perfect readability on any device.
Fluid Spacing
Maintain perfect proportions with spacing that automatically adjusts to screen size.
One-Click Imports
Import entire page layouts, sections, or components with a single click and customize to your needs.
Ready-to-Use Presets
Apply professionally designed style presets to instantly transform your website's appearance.
Intelligent Color Generation
Create complete color palettes, shades, and alpha variations from a single base color with our smart algorithm.
CSS Variables First
Build with a modern CSS variables system that makes site-wide style changes quick and consistent.
Ultimate Button Collection
Access 144 button variations with different styles, sizes, and states - all with a single click.
Simple Steps to Get Started
Get up and running with BreakMade in minutes with our streamlined setup process, designed to enhance your Breakdance experience.
Install the Plugin
Download the BreakMade plugin ZIP file from your account dashboard, then upload and install it through the WordPress plugin page with just a few clicks.
Activate & Configure
Enter your license key to activate the plugin, then use the intuitive color palette configurator to customize the design system to match your brand's identity.
Add Design Sets & Templates
Go to the Breakdance settings page and add our design sets and templates from the BreakMade library. They'll instantly appear in your Breakdance editor.
Start Creating
Create beautiful designs with our presets, blocks, color palettes, and fluid typography system. Simply drag, drop, and customize to make them your own.
Lifetime Access to BreakMade
Pay once, use forever. Get unlimited access to all our premium Breakdance components and templates with no recurring fees or subscriptions.
Framework
Essential building blocks for Breakdance
What's included:
Unlimited Lifetime Access
Complete access to everything we offer
Everything in Layers, plus:
Layers Design Set
Premium design elements for faster development
Everything in Framework, plus:
Frequently Asked Questions
Find answers to common questions about BreakMade and how our resources can enhance your Breakdance website building experience.
Premium Templates & Design Sets
for BreakDance
Access our free framework, extensive design set, and premium templates to build beautiful, functional websites faster than ever before.
Get Started Free