Neubrutalism Generator

Design your own brutalist components and copy the CSS instantly.

Design Properties

Colors

Background

Border Color

Shadow Color

Dimensions

Border Width3px

Shadow Offset X6px

Shadow Offset Y6px

LIVE PREVIEW

Generated CSS

/* Neubrutalism Card CSS */
.custom-neo-card {
  background-color: #FFFFFF;
  border: 3px solid #000000;
  box-shadow: 6px 6px 0px 0px #000000;
  transition: all 0.2s ease;
}

.custom-neo-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0px 0px #000000;
}

.custom-neo-card:active {
  transform: translate(2px, 2px);
  box-shadow: 2px 2px 0px 0px #000000;
}