Getting StartedInstallation and setup guides 6
FormInput and selection components 26
LayoutWorkflow and structural layout components 10
NavigationMenu surfaces and hierarchical actions 7
OverlayModal and floating layer surfaces 3
FeedbackStatus, empty, progress, and loading placeholder patterns 6
UtilityGeneral-purpose interface utilities 7

Supported contract

Apply slider CSS tokens to the component host. Labels and summaries remain in your shell.

Host tokens

range-slider.tokens.css

css
tng-range-slider.price-filter {
  --tng-slider-track-color: #d1d5db;
  --tng-slider-range-color: #0f766e;
  --tng-slider-thumb-color: #ffffff;
  --tng-slider-thumb-border-color: #0f766e;
  --tng-slider-track-size: 0.5rem;
  --tng-slider-thumb-size: 1.25rem;
}

Styled example

Price filter Minimum value Maximum value
$25$80