MagicKit.ai

Buton Oluşturucu

Hover efektleri, gradyanlar, gölgeler ve animasyonlarla güzel CSS butonları oluşturun. Renkleri, kenarlıkları, dolguyu özelleştirin ve üretime hazır CSS kodunu kopyalayın.

Renkler

Tipografi

16px

Boşluk

24px
12px

Kenarlık

0px
8px
200ms

Efekti görmek için üzerine gelin

/* Button Styles */
.button {
  background-color: #3b82f6;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  padding: 12px 24px;
  border-radius: 8px;
  border: none;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  transition: all 200ms ease;
  cursor: pointer;
}

.button:hover {
  background-color: #2563eb;
}

İlgili Araçlar

🔒 Anında sonuç, AI'dan hızlı. Kayıt yok. %100 gizlilik.