Centered modal with neon border and glow.
Component Library
Explore 30+ beautifully crafted UI components with neon-inspired design, animations, and modern UX patterns
Buttons & Actions
Interactive buttons with multiple styles, sizes, and states
Button Variants
Button Sizes
Floating Action Button (FAB)
Form Controls
Input fields, dropdowns, and selection controls with neon styling
Text Inputs
Selection Controls
Dropdown
Search Bar
Badges & Indicators
Status badges, labels, and filter chips for categorization and status display
Badge Variants
Primary
Success
Warning
Danger
Info
Neutral
Filter Chips
Star Rating
Data Display
Cards, tables, and stats for presenting and organizing information
Stats Cards
+12%
2,543
Total Users
+8%
$45.2K
Revenue
-3%
89.2%
Performance
Card Component
Feature Highlight
Beautiful cards with neon glow effects and smooth animations. Perfect for showcasing content and actions.
Data Table
| Project | Status | Progress | Points |
|---|---|---|---|
| Project Alpha | Active | 85% | 850 |
| Task Beta | Pending | 60% | 1,200 |
| Feature Gamma | Complete | 100% | 650 |
Feedback & Notifications
Alert banners, toast notifications, and progress indicators
Alert Banners
Toast Notifications
Progress Indicators
Loading...
Tooltip
Navigation & Interactive
Tabs, accordions, modals, and pagination for navigation and user interaction
Tabs
Overview content goes here with all the important information about this section.
Details content shows more specific information about the selected item.
Settings content allows you to configure various options and preferences.
Accordion
Modal Dialog
Pagination
Sidebar Navigation
Real-world Examples
See Indie Neon UI in action with complete application examples
Component Library
Full component showcase with code examples and detailed documentation for developers
View ComponentsColor Themes
2,500+ color variations available through the interactive color slider at the top of this page
Why Choose Indie Neon UI?
Modern, lightweight, and packed with features for building beautiful interfaces
🎨 Beautiful Design
Neon-inspired aesthetic with smooth animations, gradients, and glow effects that make your UI stand out
⚡ Zero Dependencies
Pure HTML, CSS, and JavaScript. No frameworks required. Just 92.5KB minified
🎯 Easy to Use
Simple class-based API. Just add classes to your HTML elements and you're ready to go
♿ Accessible
Full keyboard navigation, ARIA labels, and screen reader support built-in
📱 Responsive
Works beautifully on desktop, tablet, and mobile devices with optimized touch interactions
🎨 2,500 Colors
Dynamic color system with real-time theme updates. Customize to match your brand perfectly
Get Started
Quick and easy installation - choose your preferred method
NPM Package
Install via npm for use in modern build tools and full control over customization
npm install indie-neon-ui
Full Control
Customizable
Tree Shakeable
CDN (Single File)
All-in-one bundle with CSS and JS combined for the quickest setup possible
<script src="https://unpkg.com/indie-neon-ui@latest/dist/indie-neon-ui.cdn.js"></script>
Single File
Instant Setup
Auto-updated
CDN (Separate Files)
Load CSS and JS separately for better caching and control
<link rel="stylesheet" href="https://unpkg.com/indie-neon-ui@latest/dist/indie-neon-ui.min.css">
<script src="https://unpkg.com/indie-neon-ui@latest/dist/indie-neon-ui.min.js"></script>
Better Caching
Flexible
Standard
Quick Start Example
After including the library, initialize it in your JavaScript:
// Initialize Indie Neon UI
IndieNeon.init();
// Show a toast notification
IndieNeon.toast("Welcome!", {tone: "good"});
// Configure custom actions
IndieNeon.configure({
actions: {
"my-action": () => alert("Action!")
}
});