MagicKit.ai

Trình Tạo Nút

Tạo các nút CSS đẹp với hiệu ứng di chuột, gradient, bóng và hoạt ảnh. Tùy chỉnh màu sắc, viền, padding và sao chép mã CSS sẵn sàng sử dụng.

Màu Sắc

Kiểu Chữ

16px

Khoảng Cách

24px
12px

Viền

0px
8px
200ms

Di chuột để xem hiệu ứng

/* 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;
}

Công cụ liên quan

🔒 Kết quả tức thì, nhanh hơn AI. Không cần đăng ký. 100% riêng tư.