2

Как можно сделать такой градиент с тенью внизу?

введите сюда описание изображения

1 ответ 1

5

Это называется - Конические градиенты в CSS background: conic-gradient();

body,
section {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
  margin: 0;
  padding: 0;
  background: conic-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 1), rgba(100, 100, 0, 1));
}

h1 {
  font-size: 120px;
  background: conic-gradient(rgba(100, 100, 0, 1), rgba(0, 0, 0, 1), rgba(255, 255, 255, 1));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
}
<section>
  <h1>Заголовок</h1>
</section>

1

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.