CSS shapes

A collection of lightweight css shapes

How to use CSS shapes?

These CSS shapes are created in a square bounding box. The shapes are created using the CSS border property. Simply copy and paste the CSS code to the style or class of an element with N x N dimention eg. 500px x 500px

The CSS shapes are lightweight than an svg or an image. Make your shapes stand out by adding image or a gradient to it

Maker avatar image

👋

Hey, I'm Dilpreet, the maker of Super Designer. I'm building simple design tools to make designing fun for everyone

This is my passion project so, I create new design tools every few weeks, get updates about new tools & follow the jouney on twitter.