Генератор переходов CSS3
Плавный переход непрозрачности
Популярные пресеты
Эффект затухания
Плавный переход непрозрачности
Эффект масштаба
Изменение размера элемента при наведении курсора
Эффект поворота
Поворот элемента при наведении
Эффект скольжения
Перемещение положения элемента
Изменение цвета
Переход цвета фона
О переходах
Переходы CSS позволяют плавно изменять значения свойств в течение заданного периода времени.
Обычно анимированные свойства включают:
- ширина, высота
- Отступы, отступы
- Непрозрачность, цвет
- transform (scale, rotate, translate)
- background-color
Совет от профессионала: используйте опцию «Все свойства» для анимации всех изменений.
Preview
Сгенерированный код
.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; } .element:hover { /* Hover styles will be generated here */ }
Элементы управления переходом
Эффекты наведения
Related Tools
CSS Beautifier
Форматируйте и украшайте свой CSS-код с профессиональной точностью
Генератор переходов CSS3
Плавный переход непрозрачности
Минификатор CSS
Сжимайте и оптимизируйте свой CSS-код с профессиональной точностью
Из десятичного в двоичный
Преобразуйте десятичные числа в двоичный код без особых усилий
RGB в CMYK
Преобразование цветов RGB в значения CMYK для дизайна печати
HEX в HSV
Преобразуйте цвета между шестнадцатеричными цветовыми моделями и цветовыми моделями HSV (оттенок, насыщенность, значение) с предварительным просмотром в режиме реального времени.