Client Components
<dwc-accordion-panel>
Style the dwc-accordion-panel client component using CSS variables, shadow parts, and slots for header, icon, and content customization.
<dwc-accordion>
Customize the dwc-accordion client component through CSS variables, shadow parts, and slots to theme expand and collapse panels.
<dwc-alert-popover>
Style the dwc-alert-popover client component with CSS variables and shadow parts to theme positioning, surface, and animation.
<dwc-alert>
Customize the dwc-alert client component using CSS variables, shadow parts, and slots to theme banner color, icon, and content.
<dwc-app-layout>
Style the dwc-app-layout client component via CSS variables and shadow parts to theme header, drawer, footer, and content regions.
<dwc-app-nav-item>
Customize the dwc-app-nav-item client component with CSS variables and shadow parts to style nav links, icons, and active states.
<dwc-app-nav>
Style the dwc-app-nav client component through CSS variables and shadow parts to theme navigation containers, spacing, and surfaces.
<dwc-avatar>
Customize the dwc-avatar client component using CSS variables and shadow parts to style size, background, initials, and image rendering.
<dwc-backdrop>
Style the dwc-backdrop client component with CSS variables to control overlay color, opacity, blur, and transition timing.
<dwc-badge>
Customize the dwc-badge client component via CSS variables and shadow parts to theme color, size, radius, and label placement.
<dwc-button>
Style the dwc-button client component with CSS variables, shadow parts, and slots for color, padding, expanse, and icon placement.
<dwc-checkbox>
Customize the dwc-checkbox client component using CSS variables and shadow parts to theme box, check icon, label, and focus states.
<dwc-choicebox>
Style the dwc-choicebox client component with CSS variables and shadow parts to theme the trigger, dropdown panel, and option list.
<dwc-color-chooser>
Customize the dwc-color-chooser client component using CSS variables and shadow parts to theme swatches, sliders, and preview surfaces.
<dwc-columns-layout>
Style the dwc-columns-layout client component using CSS variables to control column gaps, breakpoints, and responsive spacing.
<dwc-combobox>
Customize the dwc-combobox client component via CSS variables and shadow parts to theme the input, dropdown, and option items.
<dwc-datefield-spinner>
Style the dwc-datefield-spinner client component with CSS variables and shadow parts to theme date input, spinner buttons, and surface.
<dwc-datefield>
Customize the dwc-datefield client component using CSS variables and shadow parts to theme the date input, calendar trigger, and label.
<dwc-dialog>
Style the dwc-dialog client component via CSS variables, shadow parts, and slots to theme the modal surface, header, body, and footer.
<dwc-drawer>
Customize the dwc-drawer client component with CSS variables and shadow parts to theme placement, size, surface, and backdrop overlay.
<dwc-dropdown>
Style the dwc-dropdown client component using CSS variables and shadow parts to theme trigger, panel surface, and positioning.
<dwc-field-spinner>
Customize the dwc-field-spinner client component via CSS variables and shadow parts to theme the input field and increment controls.
<dwc-field>
Style the dwc-field client component using CSS variables, shadow parts, and slots to theme inputs, labels, helper text, and prefixes.
<dwc-file-chooser>
Customize the dwc-file-chooser client component with CSS variables and shadow parts to theme the picker dialog, breadcrumbs, and list.
<dwc-file-save>
Style the dwc-file-save client component using CSS variables and shadow parts to theme the save dialog, path input, and action buttons.
<dwc-font-chooser>
Customize the dwc-font-chooser client component via CSS variables and shadow parts to theme the font list, preview area, and controls.
<dwc-hotkey>
Style the dwc-hotkey client component with CSS variables and shadow parts to theme key cap surfaces, separators, and typography.
<dwc-icon-button>
Customize the dwc-icon-button client component using CSS variables and shadow parts to theme color, size, hover, and focus states.
<dwc-icon>
Style the dwc-icon client component using CSS variables and shadow parts to theme size, color, and stroke for embedded icons.
<dwc-infinite-scroll>
Customize the dwc-infinite-scroll client component via CSS variables and shadow parts to theme the loader, sentinel, and scroll container.
<dwc-listbox>
Style the dwc-listbox client component using CSS variables and shadow parts to theme the list surface, items, selection, and scrollbars.
<dwc-loading>
Customize the dwc-loading client component with CSS variables and shadow parts to theme the spinner, backdrop, and loading message.
<dwc-login>
Style the dwc-login client component using CSS variables, shadow parts, and slots to theme the form surface, fields, and action buttons.
<dwc-markdown-viewer>
Style the dwc-markdown-viewer component with CSS variables and shadow parts to theme rendered Markdown content, typography, and code blocks.
<dwc-menu>
Customize the dwc-menu component appearance through CSS variables and shadow parts for surface, spacing, and item styling.
<dwc-menubar>
Theme the dwc-menubar component with CSS variables and shadow parts that control background, item spacing, and hover states.
<dwc-menuitem>
Style the dwc-menuitem component via CSS variables and shadow parts for label, icon, indicator, and selection states.
<dwc-navigator>
Customize the dwc-navigator component appearance with CSS variables and shadow parts for paging controls and indicators.
<dwc-numberfield-spinner>
Style the dwc-numberfield-spinner increment and decrement controls with CSS variables and shadow parts for button theming.
<dwc-numberfield>
Theme the dwc-numberfield component through CSS variables and shadow parts targeting input, label, prefix, and suffix areas.
<dwc-popover>
Theme dwc-popover placement, surface, arrow visibility, and overlay through component-scoped CSS variables and shadow parts.
<dwc-popupmenu>
Style the dwc-popupmenu floating surface with CSS variables and shadow parts for elevation, padding, and item appearance.
<dwc-progressbar>
Customize the dwc-progressbar track, indicator, and label through CSS variables and shadow parts for color and sizing.
<dwc-radio>
Style the dwc-radio control, dot, and label via CSS variables and shadow parts for checked, hover, and disabled states.
<dwc-refresher>
Customize the dwc-refresher pull-to-refresh indicator with CSS variables and shadow parts for spinner, icon, and text.
<dwc-separator>
Style the dwc-separator divider line with CSS variables and shadow parts controlling thickness, color, and orientation.
<dwc-slider>
Theme the dwc-slider track, thumb, tick marks, and labels through CSS variables and shadow parts for visual customization.
<dwc-spinner>
Customize the dwc-spinner loading indicator with CSS variables and shadow parts for size, color, and animation speed.
<dwc-splitter>
Style the dwc-splitter divider and panes through CSS variables and shadow parts for handle color, width, and hover effects.
<dwc-tab-panel>
Customize the dwc-tab-panel content surface with CSS variables and shadow parts for padding, background, and borders.
<dwc-tab>
Style the dwc-tab label, icon, and indicator with CSS variables and shadow parts for active, hover, and disabled states.
<dwc-tabbed-pane>
Theme the dwc-tabbed-pane container, tab strip, and active indicator through CSS variables and shadow parts.
<dwc-table>
Style the dwc-table grid, header, rows, cells, and selection state with CSS variables and shadow parts for full visual control.
<dwc-terminal>
Customize the dwc-terminal console appearance with CSS variables and shadow parts for background, text, cursor, and font.
<dwc-textarea>
Theme the dwc-textarea multiline input with CSS variables and shadow parts for label, border, padding, and resize handle.
<dwc-textfield-spinner>
Style the dwc-textfield-spinner stepper buttons through CSS variables and shadow parts for size, color, and hover states.
<dwc-textfield>
Customize the dwc-textfield input with CSS variables and shadow parts targeting label, border, prefix, suffix, and clear button.
<dwc-timefield-spinner>
Style the dwc-timefield-spinner increment controls with CSS variables and shadow parts for stepper appearance and states.
<dwc-timefield>
Theme the dwc-timefield input through CSS variables and shadow parts for label, border, segments, and picker affordance.
<dwc-toast>
Customize dwc-toast appearance via shadow parts, slots, and position-aware CSS variables for surface, theme, and animation.
<dwc-toolbar>
Style the dwc-toolbar container, slots, and action items with CSS variables and shadow parts for background and spacing.
<dwc-tree-node>
Style the dwc-tree-node label, icon, and expand toggle with CSS variables and shadow parts for selection and hover states.
<dwc-tree>
Style the dwc-tree component with CSS variables for indentation, color, and expand-icon theming, plus shadow parts for nodes.
<dwc-upload>
Customize the dwc-upload drop zone, file list, and progress through CSS variables and shadow parts for visual theming.