Custom Color Utilities & Button Library
Built on Bootstrap 5.3 • Production Ready • 583 CSS Classes
A comprehensive collection of color utilities and button classes built on Bootstrap 5.3, featuring per-shade color control, stunning hover effects, and production-ready components. All utilities are additive and don't override Bootstrap's default styles.
Explore the complete library with these interactive demonstrations:
Explore all 495 color utility classes with visual swatches. Includes text, background, border, and chip variants for all 99 shades.
View Demo →Ready-to-use button classes with built-in shadows and hover effects. Solid, outline, and soft styles across all 11 colors.
View Demo →Five stunning hover animations including glow, gradient, 3D, and bounce effects. Perfect for creating eye-catching CTAs.
View Demo →Learn how to construct custom buttons using color utilities. Comprehensive examples with all color combinations.
View Demo →.text-{color}-{shade}).bg-{color}-{shade}).border-{color}-{shade}).text-bg-{color}-{shade}).text-outline-{color}-{shade}).btn-{color}).btn-outline-{color}).btn-soft-{color}).btn-hover-{color}).btn-glow-{color}).btn-gradient-{color}).btn-3d-{color}).btn-bounce-{color})Get started in three simple steps:
npm install
npm run build:css<link rel="stylesheet" href="public/css/bootstrap.css" />
<link rel="stylesheet" href="public/css/colors.css" />
<link rel="stylesheet" href="public/css/buttons.css" /><!-- Color utilities -->
<p class="text-blue-600">Blue text</p>
<div class="bg-indigo-200">Light indigo background</div>
<!-- Button classes -->
<button class="btn btn-blue">Solid Button</button>
<button class="btn btn-hover-purple">Hover Effect</button>
<button class="btn btn-glow-red">Glowing Button</button>Comprehensive guides and references for all features:
100 (lightest) →
200 →
300 →
400 →
500 (base) →
600 →
700 →
800 →
900 (darkest)
Perfect for a wide variety of projects:
Product cards, CTAs, badges, status indicators
Metrics, charts, status cards, data visualization
Input validation, submit buttons, field states
UI components, notifications, action buttons
Buttons, score displays, achievement badges
Tags, categories, author cards, CTAs