Stay up to date with new components!
Error!
Success! Thanks so much 🥰

Web Components On Fire

Form

Submit HTML forms with JavaScript— without writing JavaScript

Lightbox

Super charge your image gallery with a full-window carousel shown in a modal

Responsive Menu

A hamburger menu element that shows links in a drawer on small screens

Shy Header

Hide your header while the reader scrolls down and show it again when they scroll up.

Slinky

A custom element that makes many elements for expressive silliness. Like a drop shadow on steroids.
How to use it

Annotated Source Code: Shy Header

The <hotfx-shy-header> element is a very simple web component. In fact, it’s less than 50 lines and doesn’t even use a Shadow DOM. Let’s take a look.