Custom
M3 Shapes
Material Design 3 expressive shapes for icon boxes, image clipping masks, and placeholders.
Preview
Live component example.
All shapes
36 Material Design 3 expressive shapes imported from Figma.
Circle
Square
Slanted
Arch
Fan
Arrow
Semicircle
Oval
Pill
Triangle
Diamond
Hexagon
Pentagon
Gem
Very sunny
Sunny
4-sided cookie
6-sided cookie
7-sided cookie
9-sided cookie
12-sided cookie
Ghost-ish
4-leaf clover
8-leaf clover
Burst
Soft burst
Shape 36
Boom
Soft boom
Flower
Puffy
Puffy diamond
Pixel circle
Pixel triangle
Bun
Heart
Icon shape boxes
Use as soft icon containers with centered content.
Image clipping masks
Clip photos and artwork to any M3 shape.
Placeholders
Empty boxes for loading states or content slots.