Tailwinded

What's Tailwind? "Tailwind is a utility-first CSS framework for rapidly building custom user interfaces." Simple as that.

Details

Inspired by a video of Adam Wathan, Tailwind's co-creator, rebuilding Coinbase's admin interface, I decided to get familiar with this funky little framework by digging in to a few interfaces myself. As you can tell by the examples below, this quickly got out of control.

I limited myself to the default CDN version and only gave myself a couple hours for each. Please keep in mind this time limit means some of the code might make you cry and some attempts lack proper mobile-friendly versions. This not only proved to be a great way of learning the ropes with Tailwind but also of understanding — and sometimes questioning — the design decisions that went into making these interfaces.

I am in no way affiliated with or endorsed by any of the fine companies that make this great stuff. I'm just a fan with far too much time on his hands.

Craft CMS

Link

See the Pen Craft CMS by Ben (@bensomething) on CodePen.

Statamic CMS

See the Pen Statamic by Ben (@bensomething) on CodePen.

GitHub

Link

See the Pen GitHub by Ben (@bensomething) on CodePen.

Slack

Link

See the Pen Slack by Ben (@bensomething) on CodePen.

Safari

Link

See the Pen Safari by Ben (@bensomething) on CodePen.

Photoshop

Link

See the Pen Photoshop by Ben (@bensomething) on CodePen.