Meridian

# Meridian — Refined Bootstrap 5 Admin Dashboard Theme

Meridian is a polished admin UI kit for teams that want clarity, speed, and a distinctive look. Built on Bootstrap 5 with a teal-and-amber design system, it gives you a complete product shell — dashboards, apps, auth, user profiles, marketing landing, and framework starters — so you can ship faster without starting from a blank canvas.

## A design system that feels intentional

Meridian is driven by CSS custom properties (`--md-*`), so retheming stays simple and consistent.

- **Typography:** Outfit for headings, Inter for body — modern, readable, product-ready
- **Palette:** Teal primary (`#0d9488`), amber accent (`#f59e0b`), slate sidebar
- **Components:** Cards, tables, badges, buttons, forms, and dropdowns styled as one system
- **Dark mode:** Full light/dark support with `data-theme`, preference saved in `localStorage`, and FOUC prevention so the first paint never flashes the wrong theme

Customize once in the token layer and the whole UI follows.

## 60+ production-ready pages

Meridian covers the screens real SaaS and admin products need:

### Dashboards
Main overview, CRM, Analytics, E-commerce, and Email Marketing — with Chart.js visuals that adapt to light and dark mode.

### Apps
Messenger, Email (inbox, details, compose, templates), File Manager, Contacts, Todo kanban board, Calendar, Invoices & invoice detail, Blog (grid, list, article, add article), and Notifications.

### User & account
Profile, Timeline, Photos, Connections, Followers/Following, Activity, About, Projects, Preferences, Settings, Security, Billing, and more.

### UI & content
Charts, Maps, Tables, Forms, full UI Kit, Pricing, and FAQ.

### Authentication
Login, Register, Forgot/Reset password, Email verification, Two-factor, and Lock screen — with a split visual/form auth layout.

### System states
403, 404, 500, Coming Soon, and Maintenance.

### Marketing
A full landing page with hero, features, social proof, pricing, FAQ, and motion (scroll reveals, count-ups, sticky nav).

## Flexible layouts for every product shape

Switch shell modes without rebuilding navigation:

- Classic sidebar (default)
- Mini (icon rail)
- Floating
- Boxed
- Full width
- Blank (shell-less)

Perfect for dense tools, focused workflows, or marketing-adjacent screens.

## A complete app chrome, out of the box

The Meridian shell is more than a sidebar and a topbar:

- Responsive sidebar with nested menus (Email, Blog, User, Layouts)
- Topbar search
- Theme toggle
- Language selector
- Notifications dropdown
- Messages dropdown
- User menu (profile, billing, settings, support, lock, logout)
- Command palette (`⌘K` / `Ctrl+K`) in framework starters
- Toast helpers for success, info, warning, and danger feedback

It feels like a finished product — not a pile of disconnected demos.

## Built for modern stacks

### HTML / Vite
Clean multi-page theme with Bootstrap 5.3, Bootstrap Icons, Chart.js, and Vite 6. Plain CSS (no SCSS required) for fast setup and easy customization.

### Framework starters included
Ship in the stack you already use:

- React
- Vue
- Angular
- Svelte
- Next.js
- Ruby on Rails 8

Each starter mirrors the HTML theme: same pages, same shell, shared navigation/content modules, and a generator to refresh page HTML after theme updates.

## Developer experience that respects your time

- Token-based theming with clear CSS variables
- Consistent class naming (`app-wrapper`, `app-sidebar`, `md-card`, `md-dropdown`, …)
- Shared starter modules for routes, navigation, notifications, messages, and page scripts
- One command to regenerate framework page content after HTML edits
- Release packaging script for clean distributable zips

Start from HTML, or jump straight into your preferred framework — Meridian meets you where you build.

## Who Meridian is for

- SaaS founders and product teams
- Agencies building client dashboards
- Developers who want Bootstrap quality without reinventing layout and chrome
- Teams that need both an HTML demo and production starters

If you want an admin theme that looks premium, covers real product surfaces, and stays easy to customize, Meridian is ready to become your product’s UI foundation.