/ThemeButton
Add a dark-mode aware theme layer to a button component — e.g. a primary cta button with loading and disabled states.
Web & Frontendeasy#button#ui
Styling
24 commands
/StyleToast
Write clean, responsive styles for a toast notification system — e.g. a stacked toast queue for success and error messages.
Web & Frontendadvanced#toast#notification
/ThemeDropdown
Add a dark-mode aware theme layer to a dropdown or select menu — e.g. a searchable country select dropdown.
Web & Frontendadvanced#dropdown#select
/StyleTooltip
Write clean, responsive styles for a tooltip or popover — e.g. a hover tooltip explaining a disabled button.
Web & Frontendeasy#tooltip#popover
/ThemeNavBar
Add a dark-mode aware theme layer to a site navigation bar — e.g. a sticky navbar with a mobile hamburger menu.
Web & Frontendeasy#navbar#navigation
/StyleModal
Write clean, responsive styles for a modal or dialog — e.g. a confirmation dialog with focus trap.
Web & Frontendmedium#modal#dialog
/ThemeToast
Add a dark-mode aware theme layer to a toast notification system — e.g. a stacked toast queue for success and error messages.
Web & Frontendadvanced#toast#notification
/StyleCarousel
Write clean, responsive styles for an image or content carousel — e.g. a product image carousel with dot indicators.
Web & Frontendeasy#carousel#slider
/ThemeTooltip
Add a dark-mode aware theme layer to a tooltip or popover — e.g. a hover tooltip explaining a disabled button.
Web & Frontendeasy#tooltip#popover
/StyleCard
Write clean, responsive styles for a content card component — e.g. a pricing card with a highlighted plan.
Web & Frontendmedium#card#layout
/ThemeModal
Add a dark-mode aware theme layer to a modal or dialog — e.g. a confirmation dialog with focus trap.
Web & Frontendmedium#modal#dialog
/ThemeCarousel
Add a dark-mode aware theme layer to an image or content carousel — e.g. a product image carousel with dot indicators.
Web & Frontendeasy#carousel#slider
/StyleSidebar
Write clean, responsive styles for a collapsible sidebar — e.g. a dashboard sidebar that collapses to icons.
Web & Frontendmedium#sidebar#layout
/ThemeCard
Add a dark-mode aware theme layer to a content card component — e.g. a pricing card with a highlighted plan.
Web & Frontendmedium#card#layout
/StyleForm
Write clean, responsive styles for a form layout — e.g. a signup form with email.
Web & Frontendadvanced#form#inputs
/StyleBadge
Write clean, responsive styles for a status badge component — e.g. a colored badge showing order status.
Web & Frontendmedium#badge#status
/ThemeSidebar
Add a dark-mode aware theme layer to a collapsible sidebar — e.g. a dashboard sidebar that collapses to icons.
Web & Frontendmedium#sidebar#layout
/StyleTable
Write clean, responsive styles for a data table component — e.g. a sortable table of 200 customer rows.
Web & Frontendadvanced#table#data
/ThemeForm
Add a dark-mode aware theme layer to a form layout — e.g. a signup form with email.
Web & Frontendadvanced#form#inputs
/StyleButton
Write clean, responsive styles for a button component — e.g. a primary cta button with loading and disabled states.
Web & Frontendeasy#button#ui
/ThemeBadge
Add a dark-mode aware theme layer to a status badge component — e.g. a colored badge showing order status.
Web & Frontendmedium#badge#status
/StyleDropdown
Write clean, responsive styles for a dropdown or select menu — e.g. a searchable country select dropdown.
Web & Frontendadvanced#dropdown#select
/ThemeTable
Add a dark-mode aware theme layer to a data table component — e.g. a sortable table of 200 customer rows.
Web & Frontendadvanced#table#data
/StyleNavBar
Write clean, responsive styles for a site navigation bar — e.g. a sticky navbar with a mobile hamburger menu.
Web & Frontendeasy#navbar#navigation