Bayat Design System

A comprehensive collection of reusable web components built with Stencil, designed for modern web applications.

Component Categories

Explore our components organized by their functionality and use cases

📝

Form Components

Input fields, checkboxes, radios, sliders, and form validation

8 components
🎯

Buttons & Actions

Buttons, button groups, and action-related components

3 components
🧭

Navigation

Tabs, breadcrumbs, skip links, and navigation patterns

4 components
💬

Feedback

Alerts, toasts, tooltips, progress indicators, and loading states

6 components
📐

Layout

Containers, grids, boxes, cards, and structural components

5 components
📊

Data Display

Avatars, badges, icons, and data visualization components

4 components
🎭

Overlays

Modals, dropdowns, popovers, and overlay components

3 components
🛠️

Utilities

Theme toggles, focus traps, visually hidden, and utility components

5 components