bootlegance

Bootlegance

Elegant Bootstrap themes that redefine your project’s aesthetic.

Bootlegance is a collection of carefully crafted Bootstrap 5 themes designed to elevate the look and feel of your projects. From bold brutalist designs to refined minimalism, each theme is built to make your applications stand out.

View Theme Gallery

Features

Getting Started

Installation

  1. Download a theme CSS file from the Bootlegance releases
  2. Add it to your project after Bootstrap’s default CSS:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Load latest theme CSS from CDN -->
<link href="https://cdn.jsdelivr.net/gh/lesichkovm/bootlegance@latest/themes/{theme-name}/theme.css" rel="stylesheet">

<!-- Load specific version of theme CSS from CDN -->
<link href="https://cdn.jsdelivr.net/gh/lesichkovm/bootlegance@{release-tag}/themes/{theme-name}/theme.css" rel="stylesheet">
  1. That’s it! Your Bootstrap components now have the Bootlegance theme applied.

Dark Mode

Toggle dark mode by adding data-bs-theme="dark" to your <html> element:

<html data-bs-theme="dark">
  <!-- Your content -->
</html>

Or dynamically switch with JavaScript:

document.documentElement.setAttribute('data-bs-theme', 'dark');

Available Themes

Every theme ships exactly two modes — light and dark. A different palette is a separate theme (e.g. Dracula and Dracula Soft), not an extra mode.

Theme Description Preview Best For
Adwaita Neutral GNOME/libadwaita foundation, adaptive Preview Enterprise/desktop apps, accessibility-first, Linux
Ant Design Enterprise-grade UI design language Preview Enterprise dashboards, complex data-heavy applications
Ayu A simple, bright, and elegant theme designed for all day coding comfort. Preview Developers, code-heavy UIs, editors
Brutalski Bold, raw, geometric brutalism Preview Developers, tech-forward projects, design portfolios
Carbon Clinical, precise, enterprise-ready Preview Enterprise apps, dashboards, developer tools
Catppuccin Official Catppuccin palette, 4 flavours Preview Developer tools, terminals, editors, cozy apps
Catppuccin Frappé The softer mid-dark Catppuccin flavour, with light accents re-mixed for a bright surface. Preview Sibling of Catppuccin
Catppuccin Macchiato The mid-dark Catppuccin flavour, with light accents re-mixed for a bright surface. Preview Sibling of Catppuccin
Civic Inspired by the U.S. Web Design System (USWDS) Preview Government, digital services, accessibility-first
Classic Mac OS System 7 / Mac OS 8 Platinum desktop interface Preview Retro projects, nostalgic UIs
Cyberpunk / Synthwave ‘84 Neon option for gaming and entertainment with glowing cyan/magenta accents. Preview Gaming, entertainment, synthwave UIs
Dracula Vibrant neon palette with an optional glow layer Preview Editor-adjacent apps, terminals, striking dashboards
Dracula Soft The same eleven colours, softened Preview Long sessions, calmer workspaces, shared screens
Editorial / Paper Serif typography and warm off-white parchment paper for blogs and docs. Preview Blogs, documentation, publishing
Everforest A green, comfortable, low-contrast palette designed to be easy on the eyes. Preview Developers, code-heavy UIs, editors
Fluent Windows 11 Fluent Design theme Preview Modern desktop apps, Windows-centric UIs, web applications
Forest Natural, earthy, organic Preview Eco-conscious brands, wellness, sustainability
GitHub Primer GitHub’s official Primer design system palette for developer tools and apps. Preview Developers, code-heavy UIs, editors
Glassmorphism Frosted glass panels, backdrop blurs, and ambient background gradients. Preview Portfolios, dashboards, modern apps
Gruvbox Retro-groove earthy palette, dark & light Preview Developer tools, terminals, code-heavy UIs
High Contrast WCAG AAA contrast compliance with high visibility focus indicators and bold component borders Preview Accessibility-first UIs, public sector, low vision
Kanagawa An elegant palette inspired by Japanese paintings and dark wood aesthetics. Preview Developers, code-heavy UIs, editors
KDE Breeze KDE Plasma desktop inspired theme Preview Linux desktop apps, open source projects
Material Design 3 Material You design system Preview Mobile-first web apps, modern Google-style UIs
Midnight Dark, sophisticated, professional Preview Corporate apps, SaaS, modern tech
Neo-brutalism (soft) Thick borders and offset shadows in bright colors with soft rounded corners. Preview Portfolios, modern products, marketing
Night Owl A theme for nocturnal programmers who like working late into the night. Preview Developers, code-heavy UIs, editors
Nord Arctic-based, 4 official styles Preview Professional tools, dashboards, long-session work
Nord Aurora Nord’s alternative colour scheme, deep aurora blue with the frost accent family. Preview Sibling of Nord
Nord Frost A lifted Polar Night with brighter frost accents — still one accent, two modes. Preview Sibling of Nord
Ocean Cool, calm, trustworthy Preview Finance, corporate, professional services
One Dark Iconic Atom One Dark theme adapted for modern Bootstrap 5 interfaces. Preview Developers, code-heavy UIs, editors
Orchis Material Design × macOS, floating panels, 10 presets Preview Designer-grade desktop apps, branded products, Linux
Orchis Cyan The cyan Orchis accent — clean and contemporary. Preview Sibling of Orchis
Orchis Green The green Orchis accent on floating, softly elevated panels. Preview Sibling of Orchis
Orchis Orange The orange Orchis accent, energetic and Material-forward. Preview Sibling of Orchis
Orchis Pink The pink Orchis accent with a bright designer feel. Preview Sibling of Orchis
Orchis Purple The purple Orchis accent on floating, softly elevated panels. Preview Sibling of Orchis
Orchis Red The red Orchis accent, bold and high contrast. Preview Sibling of Orchis
Orchis Sage The sage Orchis accent — muted, editorial and calm. Preview Sibling of Orchis
Orchis Slate The slate Orchis accent for understated professional interfaces. Preview Sibling of Orchis
Orchis Yellow The yellow Orchis accent with highlighter energy. Preview Sibling of Orchis
Pantheon elementary OS desktop theme Preview Clean minimalist products, Linux apps
Print-Optimized Tuned for printed pages, PDFs, and document presentation with paper typography and page-break rules Preview Reports, document publishing, PDF exports, printable UIs
Rosé Pine All natural pine, faux fur and a bit of soho vibes for the classy aesthetic. Preview Developers, code-heavy UIs, editors
Seneca Enterprise UI inspired by ExtJS Classic Preview Enterprise apps, internal dashboards, complex data UIs
Sepia / Reading mode Kindle-style warm paper theme designed for long-form content. Preview Reading apps, blogs, articles
Slate Minimal, neutral, clean Preview Content-heavy sites, reading, simplicity
Solarized Precision color palette designed for maximum readability and visual comfort. Preview Developers, code-heavy UIs, editors
Sunrise Warm, energetic, light Preview Creative portfolios, startups, inviting projects
Swiss / International Style Strict grid, neutral palette, signal red accent and Helvetica-like type. Preview Design portfolios, typography-focused sites
Terminal / CRT Green or amber phosphor CRT retro terminal theme with monospaced typography. Preview Dev tools, terminal apps, portfolios
Tokyo Night A clean, dark/light theme inspired by the Tokyo Night editor theme with vibrant blues and purples. Preview Developers, code-heavy UIs, editors
Vanguard Faithfully recreated Bootstrap 3 aesthetic Preview Legacy projects, nostalgia, familiarity
Vimix macOS-inspired GNOME theme with 9 colour variants Preview Ubuntu/ GNOME apps, desktops, multi-brand products
Vimix Dark The graphite Vimix accent — restrained, neutral and work-focused. Preview Sibling of Vimix
Vimix Green The green Vimix accent for a fresh, energetic interface. Preview Sibling of Vimix
Vimix Orange The orange Vimix accent, closest to Ubuntu warmth. Preview Sibling of Vimix
Vimix Pink The pink Vimix accent with a friendly, modern feel. Preview Sibling of Vimix
Vimix Purple The purple Vimix accent for richer, more creative products. Preview Sibling of Vimix
Vimix Red The red Vimix accent with high visual urgency. Preview Sibling of Vimix
Vimix Teal The teal Vimix accent — calm and technical. Preview Sibling of Vimix
Vimix Yellow The yellow Vimix accent, bright and high-visibility. Preview Sibling of Vimix
Whitehall Clinical, high-accessibility UI Preview Public sector, high-accessibility, clinical apps
WhiteSur macOS-inspired, frosted glass and vibrancy Preview Consumer apps, dashboards, polished product UIs
Windows 98 Classic Windows 98 3D bevel desktop theme Preview Retro apps, nostalgia, 90s web style
Yaru Ubuntu Yaru inspired theme. Warm, approachable, and human-centric. Preview Open-source projects, personal blogs, friendly interfaces

More themes coming soon.

Usage Example

<!DOCTYPE html>
<html lang="en" data-bs-theme="light">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Bootlegance Example</title>
    
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="bootlegance-brutalski.css" rel="stylesheet">
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <div class="container">
            <span class="navbar-brand">My App</span>
        </div>
    </nav>
    
    <main class="container mt-5">
        <h1>Welcome to Bootlegance</h1>
        <p>Your Bootstrap projects, elevated.</p>
        <button class="btn btn-primary">Get Started</button>
    </main>
    
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

Customization

Each theme is built using CSS custom properties (variables), making it easy to customize colors and spacing:

:root {
  --bs-primary: #your-color;
  --bs-secondary: #your-color;
  --bs-body-bg: #your-color;
}

Deployment

Bootlegance is published as a GitHub Pages site using GitHub Actions (.github/workflows/pages.yml). The workflow automatically builds the site artifact (_site/) by assembling docs/ and themes/ together, creating .nojekyll, and generating sitemap.xml and robots.txt.

Enabling GitHub Pages in Repository Settings

  1. Go to repository Settings -> Pages.
  2. Under Build and deployment -> Source, select GitHub Actions (Required: selecting branch deployment will cause GitHub Pages to process root README.md via Jekyll instead of serving docs/index.html as the root gallery page).

Custom Domain Setup (Optional)

To use a custom domain in the future:

  1. Create a file named docs/CNAME containing your custom domain name (e.g. bootlegance.com).
  2. Add a CNAME DNS record pointing your domain to lesichkovm.github.io.

Browser Support

License

MIT License — feel free to use in personal and commercial projects.

Contributing

Contributions are welcome! Please submit pull requests or open issues for suggestions and bug reports.

Credits

Bootlegance themes are built on Bootstrap, the world’s most popular front-end framework.


Made with elegance.🎨