Blog

No more containers

November 10, 2023

Tired of using containers and wrapper divs? Struggling with how to breakout sections that need to go wider than the container width? This video is 💰💰💰

If Vanna White becomes AI ...

October 31, 2023

A modern "twist" on a Solari board using AlpineJs and Css. 

Disable Craft Plugins

October 23, 2023

In Craft 4, the environmental config override for disabledPlugins is CRAFT_DISABLED_PLUGINS.

Gradient Borders Exploded

October 23, 2023

This was really cool demo on CSS gradient borders but the eye catcher is the 3d exploding layers. 2 🔥 tips for the price 1.

AlpineJS Mask

October 23, 2023

🥸 Alpine Plugin: Mask

One directive: x-mask

Easy, powerful and elegant input masking.

Scribbles

October 23, 2023

Vector Scribbbles are FREE 🥳

Go grab them right now! https://scribbbles.design

Tabular Numbers

October 23, 2023

If you're animating numbers, use this line of CSS

.numbers {
   font-variant: tabular-nums;
}

It will make sure your numbers don't jump around like this 👍

Make Waves

October 23, 2023

Make some waves! 🏄‍♂️

https://getwaves.io

Typography

October 23, 2023

For anyone who loves typography, this little gem 💎 from @mikemai2awesome is one of my favorites. Clear, concise, actionable, and beautifully designed:

Interface design

October 23, 2023

🔥 Design tip for developers

A good way to make your interface look “designed” is to use a consistent space scale

It's not art, it's science 🧬

With TailwindCSS this is so easy.

Gradient Border Effect

October 23, 2023

Really cool CSS gradient border effect I recreated after seeing it on the warp website. Props to Wes Bos for this one.

Demo: https://htmlpreview.github.io/?https://raw.githubusercontent.com/wesbos/hot-tips/main/warp-card.html…

Code: https://github.com/wesbos/hot-tips/blob/main/warp-card.html

CSS Pie Chart

October 22, 2023

With a few simple lines of CSS you can create a beautiful 🥧 chart 

background:conic-gradient(
   #a78bfa 0deg 45deg,
   #fb923c 45deg 90deg,
   #a3e635 90deg 225deg,
   #22d3ee 225deg 0deg
);