CSSButtonMaker

About CSSButtonMaker

CSSButtonMaker is a browser-based tool for generating CSS button styles. It provides controls for properties such as margin, padding, box sizing, width and height (including minimum and maximum values), color, font settings (size, family, kerning, weight, style, line height), text alignment and decoration, border and border radius, outline and outline offset, background, and box shadow.

The tool supports separate styling states for static, hover, and focus button appearances, and includes a code editor view for the generated output. It also offers plugins, templates, and an import/export function for saving or transferring button designs.

This tool is aimed at web developers and designers who want to visually configure button CSS properties without writing the styles by hand.

Key features

• Visual CSS button style editor with live preview
• Adjustable box model properties (margin, padding, width/height, box-sizing)
• Typography controls (font family, size, weight, style, line height, text align/decoration)
• Border, border-radius, outline, background, and box-shadow customization
• Static, hover, and focus state styling
• Code editor with import/export and template plugins