I love exploring new design and front-end concepts, and I’m particularly drawn to vibrant, charming design styles. I find them refreshing, especially compared to the more mundane designs I work with professionally on a daily basis. This particular style even reminds me of one of my favorite childhood cartoon series — Wallace and Gromit by Aardman.

I developed this package while working on the Claymorphism article for Smashing Magazine. After the article was published, it sparked a major discussion on the web, particularly on Hacker News, where there were varied opinions on the subject.

I also created a demo website that showcases all the features of the clay.css.

The article and clay.css have gained significant traction on Twitter, reaching developer communities worldwide, with many praising the unique style and feel. It was even featured in the CSS-Tricks newsletter, which I’m incredibly proud of.

#工程师工具 看到一个很咔哇伊的果冻感的 CSS 库「CLAY.CSS」，整体效果看着很舒服，好久没有看到这种设计风格了，颜色搭配也是很养眼，假如你有类似的产品和网站可以试试看。
🤖 https://t.co/JOkAcHJWBd pic.twitter.com/MrJrTrwbta

— Tw93 (@HiTw93) January 15, 2023

I love this effect I’ve seen in 3D art circles but I didn’t know it was called claymorphism. Well, here’s a handy micro CSS utility class called clay.css that immediately turns your regular ol’ box components into something with a bit more depth and oomph like this.

CSS-Tricks

Editorial team

Today, clay.css boasts over 550 stars on the repository and sees between 200 and 350 weekly downloads.