Is there an easy solution in Webflow for creating a slider element with a bar on the left that changes the content on the right when slid?

TL;DR

Add a custom <input type="range"> slider via an HTML embed and style it with CSS.
Create content divs with data-slide attributes, hiding all but the default.
Use JavaScript to listen for slider input and toggle visibility of matching content based on data-slide value.

You're trying to create a slider-based content switcher in Webflow: a slider (bar) on the left that dynamically updates content on the right. Webflow doesn't offer this natively out-of-the-box, but you can build it using a combination of native range input, interactions, and a bit of custom logic.

1. Add and Style a Range Slider Element

Use an HTML Embed or Custom Code Embed to add an <input type="range"> element to your Webflow canvas. Webflow Designer doesn’t offer a native UI for range sliders.
Example: use a simple embed with <input type="range" id="content-slider" min="1" max="3" value="1">.
Style the slider as needed using custom CSS in the page <head> or inside the Embed itself.

2. Create Your Content Sections

Create two or more content divs on the right side (e.g., “Content 1”, “Content 2”, “Content 3”).
Assign each one a combo class or custom attribute like data-slide="1", data-slide="2", etc.
Initially set all content sections to Display: None, except the first one.

3. Add Simple Custom Code to Link the Slider to Content

Webflow Interactions don’t work natively with input range changes, so you need light custom JavaScript.
Inside the Before tag section of your page’s Page Settings, add this:
(Do not include