Skip to content

webdotpulse/B5-Theme-NeonGlass

Repository files navigation

Neon Glass - Bootstrap 5 Custom Theme

This is a custom Bootstrap 5 theme featuring a "Neon Glass" aesthetic with dark mode, glassmorphism effects, and glowing borders.

Features

  • Dark Mode Base: Deep dark background colors.
  • Glassmorphism: Translucent cards with blur effects.
  • Neon Glow: Cyan/Blue glowing borders and text accents.
  • Custom Components:
    • .neon-card: Glass cards with hover effects.
    • .audio-viz: Animated audio visualizer bars.
    • Customized standard Bootstrap components (Buttons, Inputs, Cards).

Project Structure

  • src/scss/: SASS source files.
    • _variables.scss: Bootstrap variable overrides.
    • _custom.scss: Custom theme styles and mixins.
    • styles.scss: Main entry point importing Bootstrap.
  • dist/css/: Compiled CSS.
  • public/: Static assets (images).
  • index.html: Landing page example.
  • components.html: Component showcase.

Usage

  1. Install Dependencies:

    npm install
  2. Build CSS:

    npm run build:css
  3. Watch for Changes:

    npm run watch:css
  4. Verify/Screenshot: (Requires Playwright installed in python environment)

    python3 verify_theme.py

Screenshots

Landing Page

Landing Page

Components

Components

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors