Grunge / Distressed UI components
Grunge and distressed style use rough textures, torn edges, splatter, and gritty type for a raw, rebellious mood. Build it with these free React and Tailwind components.
Grunge / Distressed components
- ✓ Unlimited components
- ✓ All 41 styles
- ✓ Figma export
About grunge / distressed
Grunge and distressed style use rough textures, torn edges, splatter, and gritty type for a raw, rebellious mood. Build it with these free React and Tailwind components. Gritty texture, punk, distressed type.
All Grunge / Distressed blocks are free, MIT-licensed and copy-paste ready in React & Tailwind. Need raw CSS? Try the free generators, or browse every look in the full collection.
FAQ
Grunge and distressed style use rough textures, torn edges, splatter, and gritty type for a raw, rebellious mood. Build it with these free React and Tailwind components.
Grunge / Distressed is defined by gritty texture, punk, distressed type. Use the shared color, radius, border, shadow and motion tokens in the examples above to reproduce the look consistently in React and Tailwind.