Как нож CSS

Хотите сделать свой текст ножом с помощью CSS? Вот пример, как это можно сделать:

HTML код:

<p class="knife-text">Ножом</p>

CSS код:

.knife-text {
  font-size: 72px;
  font-family: Arial, sans-serif;
  color: #333;
  text-shadow: 
      1px 0px 0px #f00, 
      2px -1px 0px #ff0, 
      3px -2px 0px #0f0, 
      4px -3px 0px #0ff, 
      5px -4px 0px #00f, 
      6px -5px 0px #f0f, 
      7px -6px 0px #f00;
}

Этот код позволит сделать текст «Ножом» с красивой тенью, которая выглядит как нож. Для этого мы используем свойство «text-shadow», задающее тень текста.

Как видно из кода, мы задаем 7 отдельных параметров для свойства «text-shadow», которые формируют эффект ножа. Каждый параметр задает сдвиг тени по X и Y, а также её цвет. Последний параметр (f00) повторяет первый, чтобы создать замкнутый круг.