Tinkersynth

Create and purchase unique generative art.

Folding the DOM

How you can create nifty fold effects with CSS.

Finding your first remote job

Strategies to discover and land your first gig.

Magical Rainbow Gradients with CSS Houdini and React Hooks

Buttons with a bit of flair.

Embracing modern image formats

Tiny cross-browser images, in HTML and React.

Full-Bleed Layout Using CSS Grid

An elegant solution to a tricky modern layout.

Hands-Free Coding

Developing software using dictation and eye-tracking.

Operator Lookup

A search engine to learn more about JavaScript operators.

The rules of margin collapse

The logic behind a weird CSS behavior.

An interactive guide to CSS transitions

How you can use them to create lush, polished animations.

What the heck, z-index??

Let’s explore one of the most misunderstood CSS mechanisms.

How to learn stuff quickly

Learning to learn matters, especially for web developers.

The world of CSS transforms

The ‘transform’ property is much more versatile than you think.

An interactive guide to keyframe animations

How one of the most powerful, versatile tools in CSS works.

Designing beautiful shadows in CSS

How to transform typical box-shadows into beautiful, life-like ones.

CSS Shadow Palette Generator

A tool to help you create lush, realistic CSS shadows.

My custom CSS reset

What it does and why you might want to use it.

Gradient Generator

A tool to create vivid gradients with different color modes.

Understanding layout algorithms

The mental model shift that makes CSS more intuitive.

The front-end developer’s guide to the terminal

The missing manual of terminal fundamentals for JavaScript developers.

You don’t need a UI framework

“I don’t think UI frameworks should be used for most consumer-facing products.”

“There are plenty of frameworks/libraries/tools I don’t like, but I try not to talk shit about them. I’ve been on the receiving end of people criticizing the free and open-source stuff I’ve built, and it isn’t fun at all.”

The surprising truth about pixels and accessibility

Let’s answer the question “Should I use pixels or rems?” once and for all.

Statements vs. expressions

The difference between a ‘statement’ and an ‘expression’ in JavaScript.

Why React re-renders

Let’s build a mental model for how React’s re-rendering process works.

An interactive guide to Flexbox

Master dynamic layouts with CSS Flexbox by using the right mental model.

Color formats in CSS

Which one to use in which case? Hex, RGB, HSL, HSB, LCH, Display P3?

Data binding in React

How to wire up all of the different form controls in React.

Clever code considered harmful

“The hard thing is solving complex problems with simple code.”