Splashery
Splash Book, a still.
Playground

Splash Book

Pictures and Pages, built from a recipe. Row 4, column 29 of the code.

A book is a stack of pages bound along one edge, so you can turn them one at a time.

Shelf
Pictures and Pages
Kind
Built from a recipe
Your own
Your own book
Sound
Yes
Licenses
MIT, CC0, Apache-2.0

How to play

Tap the right page to turn on, the left to go back. With Pop out on (its button at the right), tap a picture to raise it.

Its controls

ControlKindRangeStart
Turn the pageTap
Turn the pageButton
Pop outSwitchOff
Draw a boxSwitchOff
Pop-up layersSwitchOff
StyleList5 choicesHardcover
Cover colorColor#2f4b6e
ReadingList2 choicesBoth pages

About it

A book is a stack of pages bound along one edge, so you can turn them one at a time. Before books, long texts were rolled up as scrolls.

Open any PDF of your own in the Splash tab and tap to turn its pages (the right page goes forward, the left back), or pull a page over by its edge. Taps turn pages as fast as you tap them. To fill the screen with a page, use the Page view button or pinch; Reading: One page goes a page at a time. Pick one of five styles.

Links work: a web link shows its address and opens only if you say so; a page link turns there. Turn on Pop out with its button at the right of the stage, then tap a picture to raise it: a photo with its depth, worked out on this device; a chart as a card. Raise up to three; tap one to lay it back. Draw a box raises anything else; Pop-up layers cuts one into cards. Drag a risen figure to tilt the book; the Depth slider sets its depth. Your file stays on your device.

Details

Splats
Opens at 130,000 at Mid Detail, 55,772 at Low, and up to 130,000 at Max
Turning
Drag turns it left and right only, until Tilt lock is off

Sources and credits

Libraries

Apache-2.0
Depth Anything V2 Small, quantized ONNX (lane LSTUDIO, copied from Splashery)
MIT
ONNX Runtime Web 1.30.0 (its modules)

In The Splash Manual

  1. Chapter 9: Codes and pages
  2. Chapter 10: Make your own

Share it

The back of the picture is this page's QR code: flip it, and point a phone at it. This link opens it in the Playground. To put it on your own page, add the element and one script tag. Every option.

https://splashery.app/play/?toy=your-book
<script type="module" src="https://splashery.app/play/src/element.js"></script>
<splashery-toy toy="your-book"></splashery-toy>

Nearby in the collection