Usage-Based Pricing Slider
Tailwind CSS pricing card with a range slider that updates the plan, monthly price and cost per 1,000 requests as usage changes.
Components tagged with "range".
3 components
Tailwind CSS pricing card with a range slider that updates the plan, monthly price and cost per 1,000 requests as usage changes.
Styled range input with a gradient fill, ring thumb and a live value bubble that follows the handle, in pure CSS and a few lines of vanilla JS.
Tailwind CSS min/max price slider with two handles, synced number inputs and a live histogram that counts products in the selected range.