The Ultimate Collection of CSS-only Shapes
Pure CSS shapes made with a single-element, modern CSS and an optimized code. All the shapes are here, look no further!
Most of the shapes accept a gradient coloration. I know you want it!
- Heart
- Star
- Starburst
- Flower
- Triangle
- Rhombus
- Hexagon
- Octagon
- Polygon
- Parallelogram
- Trapezoid
- Slanted Edge
- Curved Edge
- Corner-only borders
- Scooped Corners
- Beveled Corners
- Scalloped box
- Stamp
- Zig-Zag Edge
- Wavy Edge
- Wavy box
- Zig-Zag box
- Zig-Zag Line
- Wavy Line
- Circle Divider
- Triangle Divider
- Film Strip
- Cube/3D Box
- Circle Cut
- Triangle Cut
- Sector
- Arc
- CSS is CoolRibbon
- Breadcrumb
- CSS-only shapesTooltip/Speech Bubble
with single-element
and optimized code - CSS is The BestRounded Tab
- Plus
- Cross
- Minus
- Pin
- 100%Dashed Circle
CSS - Grid Lines
- Rounded Dashes
- Hamburger Menu
- Chevron
- 3D Zig-Zag Edge
- Lollipop
- Sparkle
- Battery
- Signal
- Wifi Icon
- Spiral
- Infinity
- Cloud
- Thunder
- Pencil
- Yin-Yang
-
Pacman
-
Batman
-
One Piece