# Neo-brutal Gelb (B 044)

Kategorie: Buttons  
Tags: brutalist, neo-brutalist, hard-shadow, square  
Seite: https://designforai.dev/de/snippet/btn-044

## Prompt

Ein neo-brutalistischer Button: leuchtend gelbe #fde047 Füllung, 3px durchgehender schwarzer Rahmen, eckige Ecken, schwarzer Text 15px bold, 12px mal 24px Padding und ein harter schwarzer Versatzschatten 5px 5px ohne Blur. Hover schiebt den Button 2px nach oben links und der Schatten wächst auf 7px; active rutscht ihn 5px nach unten rechts auf den Schatten, sodass der Schatten verschwindet. Fokus-Outline 3px Blau.

## HTML

```html
<button class="btn-044">Click me</button>
```

## CSS

```css
.btn-044 {
  font: 700 15px/1 system-ui,sans-serif;
  color: #000;
  background: #fde047;
  border: 3px solid #000;
  border-radius: 0;
  padding: 12px 24px;
  cursor: pointer;
  box-shadow: 5px 5px 0 #000;
  transition: transform .1s,box-shadow .1s
}
.btn-044:hover {
  transform: translate(-2px,-2px);
  box-shadow: 7px 7px 0 #000
}
.btn-044:focus-visible {
  outline: 3px solid #2563eb;
  outline-offset: 3px
}
.btn-044:active {
  transform: translate(5px,5px);
  box-shadow: 0 0 0 #000
}
```