Farzad UI
Unified Component Library
A consistent design system for all Farzad platforms. 45 component categories with dark/light mode support, built on CSS variables and Tailwind CSS.
Components
45
CSS Variables
20+
Theme Modes
2
Font
Inter
Color Palette
Accent
--accent
Success
--success
Warning
--warning
Danger
--danger
Info
--info
Surface
--surface
Background
--background
Border
--border
Text Primary
--text-primary
Text Secondary
--text-secondary
Text Muted
--text-muted
Accent Text
--accent-text
Foundation
Apps
Components
Buttons
Solid, outline, rounded, icon, circle, groups, dropdowns
Cards
Image, header/footer, colored, bordered, groups, actions
Alerts
Success, warning, error, info, dismissible
Badges
Status labels, pills, dots, tags, counts
Progress
Bars, sizes, striped, animated, stacked
Spinners
Border, dots, pulse, inline, overlay
Avatars
Initials, sizes, status, stacked groups
Breadcrumbs
Navigation trails, separators, collapsed
Tooltips
Hover tips, popovers, positions, rich content
Dropdowns
Menus, user menu, notifications, split
Pagination
Page navigation, sizes, rounded, icons, summary
Carousel
Slideshow, controls, indicators, captions, auto-play
Collapse
Collapsible panels, accordion, nested, colored
Data Display
Feedback
Forms
Pages
Sample Pages
Animation
CSS animations: bounce, fade, flip, slide, zoom, rotate
Treeview
Hierarchical tree, checkboxes, file explorer, search
Block UI
Loading overlays, skeleton loaders, blocking patterns
Session Timeout
Timeout warnings, idle detection, auto-logout
Helper Classes
Spacing, text, display, flex, border, shadow utilities
Maintenance
Maintenance page, starter kit, system status
Bootstrap UI
Accordion, offcanvas, placeholders, navbar, collapse
Scrollspy
Scroll-activated navigation, progress tracking