Skip to documentation
BoobstrapDocs
Get started

Starter template

Download and run the minimal Vite starter with theme tokens, components, icons, and production validation.

Get started guideCopy-ready referencev0.7.0 current
Start shipping

Starter template

Download a minimal Vite project that imports @boobstrap/boobstrap and the recommended Lucide icon set from npm. It includes a responsive landing page, theme-token overrides, components, a labeled form, and a production validation check.

Ready for npm, pnpm, Yarn, or Bun

A real project, not just a snippet

Install, run the Vite dev server, customize the semantic tokens, then validate the production bundle with one command.

index.html src/main.js src/styles.css scripts/validate.mjs package.json
Terminal
npm install
npm run dev
npm run validate

Application entry

The starter keeps framework and icon setup explicit. It imports only the six Lucide icons used by the page so the application does not ship the whole icon catalog.

JavaScript · src/main.js
import "@boobstrap/boobstrap/dist/boobstrap.css";
import { Check, Heart, Layers3, MoveRight, PanelsTopLeft, ShieldCheck, createIcons } from "lucide";
import "./styles.css";

createIcons({ icons: { Check, Heart, Layers3, MoveRight, PanelsTopLeft, ShieldCheck } });

Project-level customization

Load overrides after the framework stylesheet and change semantic tokens instead of reaching into component selectors.

CSS · src/styles.css
:root {
  --bs-color-primary: #7c3aed;
  --bs-color-primary-hover: #8b5cf6;
  --bs-container-xl: 72rem;
}

.site-shell {
  min-height: 100vh;
}

Run

Use npm run dev while building and npm run validate before shipping the generated bundle.

Customize

Keep application CSS after the framework import. Prefer semantic tokens and composition utilities for system-wide changes.

Replace

The sample content is disposable. The package setup, theme boundary, validation script, and accessible document structure are the useful starting points.