Essential: Button System
A complete foundation of primary, secondary, outline and ghost buttons with sizes, icons and accessible states.
ButtonsFree
The standalone components collection
Buttons
10 responsive buttons designs for your next project.
React / Next.js + Tailwind and standalone HTML, CSS and JavaScript.
Accessible actions with purposeful interaction and state treatments.
← Browse all categories- Independent sourceMade for your own codebase
- Responsive layoutsMobile, tablet and desktop
- Both code formatsReact/Tailwind + HTML/CSS/JS
- 10 free downloads0 designs in review
10 components found
Showing 1–10 of 10Gradient: Animated Buttons
Rich configurable gradients with restrained hover transitions, optional glow and clear interactive states.
ButtonsFree
Magnetic: Pointer Button
A bounded pointer-following CTA with a smooth neutral return, keyboard focus and reduced-motion fallback.
ButtonsFree
Glow: Illuminated Buttons
Blue, violet, pink and green illuminated controls with refined intensity options for dark surfaces.
ButtonsFree
Split: Action Dropdown
A genuine primary action paired with a keyboard-accessible dropdown and configurable options.
ButtonsFree
Loading: Async Action Button
Controlled or callback-driven async actions with progress, success, error and explicit recovery.
ButtonsFree
Ripple: Interactive Button
Pointer-positioned and keyboard-centred ripple feedback that never delays the underlying action.
ButtonsFree
Outline: Animated Border Button
Gradient, corner, underline and illuminated borders with restrained hover and focus transitions.
ButtonsFree
Morph: Transforming State Button
Stable-width labels and icons that transition between genuine consumer-owned action states.
ButtonsFree
Icon: Accessible Button System
Named icon-only controls with configurable SVG paths, shapes, sizes and accessible optional tooltips.
ButtonsFree
Prefer to customise visually? Explore the visual builder presets