# Example Gallery

**Browse by category**

**...or scroll down to see them all.** If you've made something with Idyll and would like to post it here, please open an issue on GitHub with the title "Gallery Example".

### Explorable Explanations

How to Tune a Guitar

An interactive audio guide with guitars and a little music theory.

Kernel Density Estimation

An interactive explanation of the statistical technique

The Beginner's Guide to Dimensionality Reduction

Explore the methods that data scientists use to visualize high-dimensional data.

The Barnes-Hut Approximation

Efficient computation of N-body forces

Beat Basics

Explore 3/4 and 6/8 time using John Varney's rhythm wheel.

How does the eye work?

The Math of Card Shuffling

Riffling from factory order to complete randomness.

The Etymology of Trig Functions

A graphic walkthrough of mathematical history

Travelling Salesman Algorithms

From Naive to Christofide

Multi-Armed Bandits

An exploration of epsilon greedy and UCB1 algorithms

The Explanation & Comparison of Graph Searches

A walkthrough of depth first, breadth first, and A* search algorithms

Stepping Into the Filter

Understanding the edge detection algorithms in your smartphone

Sequence Alignment with Dynamic Programming

The Smith-Waterman Algorithm

Conflict Driven Clause Learning

The Boolean Satisfiability Problem

Efficient Collision Detection

The Gilbert-Johnson-Keerthi distance algorithm

### Articles and Blog Posts

Statistical Power Analysis

Blueberry Pancakes

The D-I-Y Data of Fugazi

A Comic Introduction to Idyll

See how Idyll can be used with CSS grid to create a comic-style layout.

Autumn Colormaps

A look at trees, colormaps, and chroma.js

Who Shapes the Open Web?

An interactive tool to explore membership in W3C working groups.

From Nothing to Something in WebGL Using regl

Seattle PD’s Dashcam Problem

Visualizing 27 million frames of video lost over four years

The United Complaints of America

Analyzing over 700,000 complaints sent to the Consumer Financial Protection Bureau

Lorenz Attractor

Nonlinear Sliders

### Tutorials

Triggering Updates

How to update components in response to user events.

Animating with Idyll

How to use CSS animations and custom tweening to animate elements.

Stacking Scroller Components

Introduction to leveraging multiple Scrollers in Idyll

Using Mapbox with Idyll

Add interactive maps to your Idyll posts.

Announcing idyll.pub

Publish interactive blog posts and explorable explanations with Idyll's free hosting service.

Scaffolding Interactives

Rapidly create scroll- and step-based interactives with Idyll

Take a Walk on the Idyll Side

Exploring new ways to create interactive documents

regl

Vega Lite

Firebase

Apparatus