Tombol

<div class="ck-row ck-row-3 ck-wrap">
  <button class="ck-btn ck-btn--default">Default</button>
  <button class="ck-btn ck-btn--secondary">Secondary</button>
  <button class="ck-btn ck-btn--outline">Outline</button>
  <button class="ck-btn ck-btn--ghost">Ghost</button>
  <button class="ck-btn ck-btn--link">Link</button>
  <button class="ck-btn ck-btn--destructive">Destructive</button>
  <button class="ck-btn ck-btn--success">Success</button>
  <button class="ck-btn ck-btn--warning">Warning</button>
</div>

<div class="ck-row ck-row-3 ck-wrap">
  <button class="ck-btn ck-btn--default ck-btn--sm">Kecil</button>
  <button class="ck-btn ck-btn--default">Sedang</button>
  <button class="ck-btn ck-btn--default ck-btn--lg">Besar</button>
  <button class="ck-btn ck-btn--default ck-btn--xl">Ekstra</button>
</div>
<div class="ck-row ck-row-3 ck-wrap ck-mt-4">
  <button class="ck-btn ck-btn--outline ck-btn--icon-sm" aria-label="Salin"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><rect width="14" height="14" x="8" y="8" rx="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg></button>
  <button class="ck-btn ck-btn--outline ck-btn--icon" aria-label="Ubah"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.12 2.12 0 0 1 3 3L12 15l-4 1 1-4z"/></svg></button>
  <button class="ck-btn ck-btn--outline ck-btn--icon-lg" aria-label="Hapus"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M3 6h18M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/></svg></button>
</div>

<div class="ck-row ck-row-3 ck-wrap">
  <button class="ck-btn ck-btn--default"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M5 12h14M12 5v14"/></svg> Soal baru</button>
  <button class="ck-btn ck-btn--outline"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M7 10l5 5 5-5M12 15V3"/></svg> Ekspor</button>
  <button class="ck-btn ck-btn--destructive"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M3 6h18M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/></svg> Hapus</button>
</div>
<div class="ck-row ck-row-3 ck-wrap ck-mt-4">
  <button class="ck-btn ck-btn--default ck-btn--loading" disabled><span class="ck-btn__spinner"></span> Menyimpan…</button>
  <button class="ck-btn ck-btn--default" disabled>Nonaktif</button>
  <button class="ck-btn ck-btn--outline ck-btn--block">Lebar penuh</button>
</div>

<a class="ck-btn ck-btn--default" href="#">Mulai ujian</a>
<a class="ck-btn ck-btn--ghost ck-btn--sm" href="#">Batal</a>