Blank Page

Starter Template
A clean canvas for building your own pages

Use this page as a starting point for creating new pages. Simply copy this file, rename it, and start building your content.

Page Structure

Each page includes the following layout components:

  • Header - Floating top bar with search, quick actions, notifications, and profile dropdown
  • Sidebar - Dark navigation panel with collapsible menu items and multi-level support
  • Main Content - This area where your page content goes
  • Footer - Floating pill bar with copyright information and links
Creating a New Page
  1. Copy this blank.html file and rename it (e.g., my-page.html)
  2. Update the <title> tag in the <head> section
  3. Modify the page header title and breadcrumb navigation
  4. Replace this card content with your own content
  5. Add a link to your new page in the sidebar navigation
Adding to Sidebar Navigation

To add your new page to the sidebar, locate the navigation section in the HTML and add a new menu item:

<li class="nav-item">
  <a class="nav-link" href="my-page.html">
    <span class="nav-icon"><i class="ph ph-file"></i></span>
    <span class="nav-text">My New Page</span>
  </a>
</li>
Available CSS Classes
Class Description
.page-header Container for page title and breadcrumb
.dash-card-header Card header with title, subtitle, and optional action link
.section Content section with consistent spacing
.card Rounded content panel with soft shadow
.dashboard-grid Responsive grid layout for dashboard widgets
Tips
  • Use Bootstrap 5 utility classes for spacing, typography, and layout
  • Check other pages in this template for common patterns and components
  • The template supports both light and dark modes automatically via CSS variables
  • Icons are provided by Phosphor Icons - browse available icons at phosphoricons.com