Как сделать эффект текста css

Вы можете создать различные эффекты с текстом с помощью CSS, используя свойства text-shadow, background-image, transform и многие другие. Вот несколько примеров эффектов:

Текст с тенью

HTML:

<h2 class="text-shadow">Текст с тенью</h2>

CSS:

.text-shadow {
  text-shadow: 2px 2px 0px rgba(0,0,0,0.5);
}

Здесь мы использовали свойство text-shadow, чтобы создать тень за текстом.

Текст с градиентом

HTML:

<h2 class="text-gradient">Текст с градиентом</h2>

CSS:

.text-gradient {
  background-image: linear-gradient(45deg, #f00, #0f0, #00f);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

Здесь мы использовали свойство background-image с градиентом и комбинацию свойств -webkit-background-clip и -webkit-text-fill-color, чтобы заполнить текст градиентом.

Текст с эффектом обводки

HTML:

<h2 class="text-stroke">Текст с эффектом обводки</h2>

CSS:

.text-stroke {
  -webkit-text-stroke: 1px #000;
  text-stroke: 1px #000;
}

Здесь мы использовали свойства -webkit-text-stroke и text-stroke, чтобы создать эффект обводки текста.

Вращающийся текст

HTML:

<h2 class="text-rotate">Вращающийся текст</h2>

CSS:

.text-rotate {
  display: inline-block;
  animation: rotate 3s linear infinite;
}

@keyframes rotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

Здесь мы использовали свойство animation и ключевое слово @keyframes, чтобы создать анимацию вращения текста.

Вы можете изменять значения свойств и добавлять другие стили, чтобы создавать разнообразные эффекты с текстом в CSS.