youx.agency
Обсудить проект
info@youx.agency
YOUX agency


ВЫХОДИТЕ ИЗ ТЕНИ. ВРЕМЯ ПРИШЛО.
ОБСУДИТЬ ПРОЕКТ
En
Ru
Наш чат для помощи и общения

Делаем простой линейный градиент тени у кнопки в Tilda

Пример

Данный код помогает добавить градиентную тень на вашу кнопку в zero-блок. Также возможно изменить направление градиента, цвет и его расположение

Как выглядит :

Скопируйте и вставьте код ниже в блок "ST123"

Добавили кнопку и присвоили class "sample"

Поменяйте цвета градиента на любые другие

1
2
3

Что делаем :

Код для вставки
<style>

.sample {
  inline-size: 50vmin;
  block-size: 35vmin;
  background:  linear-gradient(
    to bottom right, 
    #FFD945, 
    #32BA7C
  );
  border-radius:30px;
  position: relative;
}

.sample::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    #FFD945, 
    #32BA7C
  );
  z-index: -1;
  transform: translateY(15%) scale(.85);
  filter: blur(30px);
}

</style>
Больше модификаций

Возможно вы поверили в себя и сегодня нужно больше знаний. Посмотрите что есть еще интересного