Предварительный просмотр кнопок

Сгенерированный CSS

.custom-button { padding: 0.75rem 1.5rem; border-radius: 0.5rem; background: #165DFF; color: white; font-weight: 500; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); transition: all 0.3s ease; }  .custom-button:hover { background: rgba(22, 93, 255, 0.9); transform: translateY(-2px); }  .custom-button:focus { outline: none; box-shadow: 0 0 0 4px rgba(22, 93, 255, 0.3), 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }  .custom-button:active { transform: translateY(0); }

Свойства кнопки

Популярные пресеты

Related Tools

CSS Beautifier

Форматируйте и украшайте свой CSS-код с профессиональной точностью

Минификатор CSS

Сжимайте и оптимизируйте свой CSS-код с профессиональной точностью

Простое создание преобразований CSS3

Мощный, интуитивно понятный инструмент для создания сложных преобразований CSS3 без написания кода. Визуализируйте изменения в режиме реального времени и копируйте сгенерированный CSS для использования в своих проектах.

Генератор радиуса границы

Генератор CSS с радиусом границы для быстрого создания объявлений CSS с радиусом границы.

Конвертер стилуса в CSS

Преобразуйте свой код SCSS в CSS. Быстро, просто и безопасно.

Создавайте красивые тени CSS Box без особых усилий

Создавайте потрясающие коробчатые тени с помощью нашего интуитивно понятного интерфейса. Скопируйте CSS-код и мгновенно используйте его в своих проектах.