Colors

Color System

Theme Palette

Discover the visual identity of PiruAdmin. This color system is built with Bootstrap 5 theme variables and utility classes, supporting light and dark modes natively.

Theme Colors

Brand colors representing actions, status, and feedback.

Primary
.bg-primary $primary
Secondary
.bg-secondary $secondary
Success
.bg-success $success
Info
.bg-info $info
Warning
.bg-warning $warning
Danger
.bg-danger $danger
Theme Color Tints (Subtle Tones)

Transparent primary brand-aware tints for high-end active statuses and backgrounds.

Primary Hover (5%)
rgba($primary, 0.05) Submenu Hover
Primary Active (10%)
rgba($primary, 0.1) Submenu Active
Primary Border (25%)
rgba($primary, 0.25) Sidebar Guide Line
Body Secondary
.bg-body-secondary Theme Backgrounds
Grayscale & Body Colors

Neutral colors that dynamically change to guarantee contrast under Dark Mode.

Body Background .bg-body
Body Tertiary .bg-body-tertiary
Card Background var(--pr-card-bg)
Solid Dark .bg-dark
Social & Brand Colors Showcase

Unified brand colors for social sign-in buttons, sharing actions, and custom avatar profiles.

Facebook
#1877f2
Google
#ea4335
X / Twitter
#000000
GitHub
#181717
LinkedIn
#0077b5
YouTube
#ff0000
Instagram
#e1306c
WhatsApp
#25d366
Spotify
#1db954
PayPal
#003087
Apple
#a2aaad
Amazon
#ff9900