EmpireUI
Sign inGet Pro
Free · React + Tailwind · MIT

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.

Browse components →Free generators

Grunge / Distressed components

Monthly revenue
$48.2k
▲ 12.5%
PRO
$24/mo
  • ✓ Unlimited components
  • ✓ All 40 styles
  • ✓ Figma export
Welcome back

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

What is grunge / distressed web design?

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.

How do I add grunge textures and distressed edges in CSS?

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.

Explore other styles

MaximalismMotion MorphismRetro FuturismNeumorphismClaymorphismSkeuomorphismFlat DesignMaterial Design