[Гайд] Настраиваем уник под себя

Привет, пришла в голову идея рассказать про то, как делать свой уник и в целом разберу каждый параметр, который можно использовать в унике!
Конечно, уников и так слишком много, но такие как я - хотят свое
Страница создания уника - https://zelenka.guru/account/uniq/test

Стиль ника:

background:

- по факту, этот параметр добавляет фон к объекту, но такое делать не стоит .
Следовательно, к этому нужно дописать доп. параметры:

-webkit-...:

- это фреймворк который показывает правильно отформатированные веб-страницы на основе их разметки:

-webkit-background-clip: text;

- Свойство задает, выходит ли фон элемента за его рамку, поле заполнения или поле содержимого.

• Без параметра -
• С параметром -

-webkit-text-fill-color:transparent;

- Свойство определяет цвет заливки символов текста.

В данном примере color: black; (доп. инфу см. ниже)

• Без параметра -
• С параметром -

Если это свойство не установлено, то используется значение параметра color.
Других WebKit'ов не замечал в униках. Если вы увидели еще какой-то WK, напишите мне, я добавлю и расскажу про него.
С WB всё.

color: ... ;

Простейший параметр, который задает обычный цвет объекту. Цвет можно записать в нескольких вариациях:

• Название цвета(только на англ.) - white, black, ... .
  
  Полный список цветов и их названия

  
• "Кодированные" цвета (#) - Самый распространенный способ. С помощью него можно указать более точный цвет.
  
  Подробная палитра

  
• Цвета RGBA - Так же еще один более точный способ rgba(0, 0, 0, 1);, где R - Red, G-Green, B-Blue, A-Alpha(Непрозрачность).
  
  Пример

  

..linear-gradient()

- Линейная заливка градиентом, присваивается только к параметру background.

• linear-gradient(Градусы(По умолчанию - 0deg), первый цвет(Через #-цвета) + процент положения первого цвета(По умолчанию 0%), последующий цвета + процент положения последующего цвета(По умолчанию 100%))

  CSS

  linear-gradient(Градусы(По умолчанию - 0deg), первый цвет(Через #-цвета) + процент положения первого цвета(По умолчанию 0%), последующий цвета + процент положения последующего цвета(По умолчанию 100%))

  Градусы можно записывать как : deg, turn, to left top... .

[Кликабельно] Подробнее о ..linear-gradient() в документации.

...radial-gradient()

- Радиальная заливка градиентом, присваивается только к параметру background.

• radial-gradient(Размер, позиция, цветовая схема);

  CSS

  radial-gradient(Размер, позиция, цветовая схема);

[Кликабельно] Подробнее о ..radial-gradient() в документации.

text-shadow: ... ;

- Тень у текста, присваивается только к тексту.

• text-shadow: (Смещение-x, смещение-y, радиус-размытия, цвет) ;

  CSS

  text-shadow: (Смещение-x, смещение-y, радиус-размытия, цвет) ;

  Все в px, кроме цвета!

[Кликабельно] Подробнее о text-shadow в документации.

Стиль лычки:

Фон (background), цвет (color) и градиенты все такие же как и с текстом, только без WK.

box-shadow:

- Тень лычки.

• box-shadow: (Позиция по X, позиция по Y, радиус размытия, цвет);

  CSS

  box-shadow: (Позиция по X, позиция по Y, радиус размытия, цвет);

[Кликабельно] Подробнее о text-shadow в документации.

text-shadow:

- Тень текст в лычке.

• См. выше.

border-radius:

- Скругление углов лычки.

• border-radius:(Скругление-x, скругление-y, радиус-размытия, цвет) ;

  CSS

  border-radius:(Скругление-x, скругление-y, радиус-размытия, цвет) ;

[Кликабельно] Подробнее о border-radius в документации.

display: none;

- полностью выключает лычку.

Дополнение

Дополнительный гайд:
Как правильно устанавливать свои иконки в уник - https://zelenka.guru/threads/3405752/

От @cursedplayer1g ​

Подвожу итоги
Пока что это все, что я смог найти в уника, если найдете что-то еще, можете написать мне об этом и я добавлю.
Надеюсь что было интересно почитать. Негатив в теме излишне.

:moon: Спасибо за внимание!