# Linked inputs: slider + number box + quick access buttons
**URL:** https://talk.observablehq.com/t/linked-inputs-slider-number-box-quick-access-buttons/4511
**Category:** Show and tell
**Created:** [January 24, 2021, 5:56pm UTC](https://talk.observablehq.com/t/linked-inputs-slider-number-box-quick-access-buttons/4511 "2021-01-24T17:56:08Z")
**Posts on this page:** 4
**Page:** 1
### Author:  [@chonghorizons](https://talk.observablehq.com/u/chonghorizons)
#### Post date: [January 24, 2021, 5:56pm UTC](https://talk.observablehq.com/t/linked-inputs-slider-number-box-quick-access-buttons/4511/1 "2021-01-24T17:56:08Z")
My first piece of reusable code in ObservableHQ.
I extended some of the ideas from linked-inputs from @mbostock and @severo (thanks!) and made a piece of reusable code for a multi-input.
> **[Slider with number input box and quick-select buttons](https://observablehq.com/@chonghorizons/slider-with-number-input-box-and-quick-select-buttons)**
>
> UPDATE Feb 5, 2021: There is an easier way to do this as of Feb4: see https://observablehq.com/@observablehq/synchronized-inputs#i I'm no longer updating this page. I needed something to allow a slider for a range (like 0 to 100), but also a box to...
> I needed something to allow a slider for a range (like 0 to 100), but also a box to allow a specific or larger number in a text box. And I wanted some quick selects for doubling, halving, and resetting.
>
> Many thanks to [Inputs / Jeremy Ashkenas | Observable](https://observablehq.com/@jashkenas/inputs) and set\_value from [Inputs + setter / Sylvain Lesage | Observable](https://observablehq.com/@severo/inputs-setter) and to these [Linked Inputs / Mike Bostock | Observable](https://observablehq.com/@mbostock/linked-inputs) and [Synchronized Views / Mike Bostock | Observable](https://observablehq.com/@mbostock/synchronized-views)
---
### Author:  [@tomlarkworthy](https://talk.observablehq.com/u/tomlarkworthy)
#### Post date: [January 24, 2021, 8:44pm UTC](https://talk.observablehq.com/t/linked-inputs-slider-number-box-quick-access-buttons/4511/2 "2021-01-24T20:44:25Z")
Excellent. If you paste the notebook link directly it will auto fill in a preview (I think you pasted a screenshot, and now I can’t easily find your notebook to upvote). See:
> **[Slider with number input box and quick-select buttons](https://observablehq.com/@chonghorizons/slider-with-number-input-box-and-quick-select-buttons)**
>
> I needed something to allow a slider for a range (like 0 to 100), but also a box to allow a specific or larger number in a text box. And I wanted some quick selects for doubling, halving, and resetting. Many thanks to...
---
### Author:  [@chonghorizons](https://talk.observablehq.com/u/chonghorizons)
#### Post date: [January 25, 2021, 3:18am UTC](https://talk.observablehq.com/t/linked-inputs-slider-number-box-quick-access-buttons/4511/3 "2021-01-25T03:18:33Z")
Yes. Thanks! I left out the notebook link by accident. Fixing now.
---
### Author:  [@chonghorizons](https://talk.observablehq.com/u/chonghorizons)
#### Post date: [February 5, 2021, 8:10pm UTC](https://talk.observablehq.com/t/linked-inputs-slider-number-box-quick-access-buttons/4511/4 "2021-02-05T20:10:14Z")
This is now done with settable inputs. See
> **[Synchronized Inputs](https://observablehq.com/@observablehq/synchronized-inputs#i)**
>
> Observable Inputs behave similarly to native HTML inputs: they expose a value and emit an input event when the user changes the value. This makes them compatible with Observable’s viewof operator. It also means that you can programmatically control...