🎨 A modern, customizable, and feature-rich UI button library designed for stunning web interfaces.Perfect for developers who demand elegance, responsiveness, and simplicity.
- 💡 Customizable Styles: Tailor colors, sizes, shapes, and effects effortlessly.
- ⚡ Lightweight & Fast: Minimal footprint, optimized for performance.
- 📱 Responsive Design: Looks fantastic on all devices.
- 🔌 Seamless Integration: Works with React, Angular, Vue, and vanilla JavaScript.
- 🌈 Predefined Themes: Use built-in themes or create your own.
- ✨ Ripple Effects: Add interactive animations with one attribute.
- 🌟 Extendable: Add custom behaviors and styles easily.
Quickly add a stylish button to your webpage:
<!-- Button Element -->
<button class="fui-btn" data-variant="primary">Click Me</button>
<!-- Include the JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/featurastic-ui-buttons@1.0.0/fui-buttons.js"></script>also, include the CSS for advanced styling:
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/featurastic-ui-buttons@1.0.0/fui-buttons.css"
/>Featurastic UI Buttons come with built-in themes:
| Variant | Usage Class | Preview Color | Preview Button |
|---|---|---|---|
| Primary | data-variant="primary" |
hsl(180, 100%, 50%) | Comming Soon! |
| Secondary | data-variant="secondary" |
hsl(338, 99%, 50%) | Comming Soon! |
| Success | data-variant="success" |
hsl(111, 100%, 50%) | Comming Soon! |
| Error | data-variant="error" |
hsl(0, 100%, 50%) | Comming Soon! |
| Netural | data-variant="netural" |
hsl(0, 0%, 50%) | Comming Soon! |
Explore the power of Featurastic UI Buttons:
<!-- Button Variants -->
<button class="fui-btn" data-variant="primary">Primary</button>
<button class="fui-btn" data-variant="secondary">Secondary</button>
<!-- Ripple Effect -->
<button class="fui-btn" data-variant="success" data-ripple="true">
Success with Ripple
</button>We ❤️ contributions! Here's how you can help:
- 🍴 Fork the repository
- 🌿 Create your feature branch (
git checkout -b feature/AmazingFeature) - 💾 Commit your changes (
git commit -m 'Add some AmazingFeature') - 🚀 Push to the branch (
git push origin feature/AmazingFeature) - 🔃 Open a Pull Request
Check out our Contribution Guidelines for more details.
This project is open-source and licensed under the CC0-1.0 License. See the LICENSE file for details.
Made with ❤️ by the Nexos Creation Team