Practical examples for modern frontend developers.

How to Build a Card Flip Animation

Learn how to apply CSS transforms and animations to playing cards

Dynamic Styling with CSS Variables

Learn the basics of CSS variables, also known as CSS custom properties

Animated Social Share Links

Learn how to build an animation for displaying social links using CSS

Nesting in CSS

A brief intro to the new CSS Nesting module

Building a React Number Ticker

Animate Between Two Numbers with React hooks and CSS

Highlighting Text on Scroll

Highlight text while scrolling through a container.

Building a React Confetti Component

Partying hard with React hooks, CSS and the js-confetti library.

Scroll-Linked Content Reveal Animation

Learn how to create a scroll-linked animation with Framer Motion.

Animated Page Transitions in Next.js

Use Framer Motion to animate route changes in your Next.js project.

Building Dynamic Icons With CSS Animation

Use the power of CSS animations to add joy to your icons.