Stylepack

Tombol

Tombol di wearebou.com

Tombol utama di wearebou.com berwarna #0a0a0a dengan teks #ffffff, sudut 9999px, dan tinggi 39px. Di bawah ini: setiap varian tombol yang dipakai situs, state hover dan focus-nya, serta CSS agar tombol Anda tampil sama.

Diukur dari wearebou.com 4 hari yang lalu.

Buka paket desain lengkapUnduh paket

Tombol primary

Read full case
Hover
tidak ada perubahan terlihat

Tombol secondary

Helsinki
Hover
tidak ada perubahan terlihat

CSS-nya

Satu class per varian, dengan nilai hasil pengukuran. Fontnya adalah font yang dipakai wearebou.com pada tombolnya.

buttons.css
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 39px;
  padding: 10.4px 17.6px;
  background: #0a0a0a;
  color: #ffffff;
  border: 1px solid #0a0a0a;
  border-radius: 9999px;
  font-size: 16px;
  font-weight: 300;
  font-family: "StabilGrotesk", sans-serif;
  cursor: pointer;
}
​
.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  padding: 4px 14px;
  background: #ffffff40;
  color: #ffffff;
  border: none;
  border-radius: 100px;
  font-size: 10px;
  font-weight: 600;
  font-family: "StabilGrotesk", sans-serif;
  text-transform: uppercase;
  cursor: pointer;
}

Untuk agen AI

Paket berupa teks biasa, tanpa kunci: ambil DESIGN.md, atau serahkan seluruh paket ke Claude Code, Cursor, atau Copilot lewat server MCP.

curl -s https://stylepack.ai/packs/wearebou.com/DESIGN.md

Pertanyaan

Bagaimana cara membuat tombol seperti wearebou.com?

Pakai CSS di halaman ini: tombol utamanya berwarna #0a0a0a dengan teks #ffffff, sudut 9999px, tinggi 39px. Tambahkan aturan hover dan focus yang tercantum di tiap varian, lalu atur font tombolnya ke font yang dipakai wearebou.com.

Apa warna tombol wearebou.com?

Tombol utama di wearebou.com berwarna #0a0a0a dengan teks #ffffff. Situs ini memakai 2 varian tombol secara keseluruhan; masing-masing tercantum di halaman ini beserta latar, border, radius, dan ukurannya.

Bisakah AI coding agent meniru tombol wearebou.com?

Bisa. Paket desain wearebou.com dari Stylepack memuat setiap varian tombol beserta state-nya, font, warna, dan screenshot, sehingga Claude Code, Cursor, atau Copilot bisa membuat tombol yang serupa.