html`
<div class="slider">
<img src="https://picsum.photos/300">
<img src="https://picsum.photos/301">
<img src="https://picsum.photos/302">
<img src="https://picsum.photos/303">
<img src="https://picsum.photos/304">
</div>
`
html`
<style>
.slider {
width: 400px;
padding: 0px;
border: groove 40px gray;
display: flex;
overflow-x: auto;
scroll-snap-type: inline;
}
.slider > img {
width: 390px;
height: 390px;
margin: 0;
border: solid 5px white;
flex-shrink: 0;
scroll-snap-align: center;
}
</style>
`
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
