Responsive Brutal Shadow

HTML_STRUCTURE

<button class='bh-btn-resp-1'>EXECUTE_SYSTEM</button>

CSS_STYLING

.bh-btn-resp-1 { width: 100%; max-width: 280px; background: #fff; color: #000; padding: 1.2rem 2rem; font-size: 1rem; font-weight: 900; border: 2px solid #fff; box-shadow: 0.4rem 0.4rem 0px #333; cursor: pointer; transition: all 0.2s ease; text-transform: uppercase; } @media (max-width: 480px) { .bh-btn-resp-1 { padding: 1rem 1.5rem; font-size: 0.85rem; } } .bh-btn-resp-1:active { transform: translate(0.2rem, 0.2rem); box-shadow: 0px 0px 0px #333; }

// DESIGN_NOTES: Komponen ini menggunakan CSS variabel untuk memudahkan kustomisasi warna dan transisi.