Как создать эффект заполнения текста в CSS.
ДЕМО
Свойства -webkit-text-fill-color и -webkit-text-stroke можно использовать для изменения цвета заливки и обводки ваших текстовых элементов. Поддержка браузера тоже неплохая!
Имейте в виду, что свойство -webkit-text-stroke не всегда дает приятные результаты: это зависит от используемого семейства шрифтов.
.text-fill {
-webkit-text-fill-color: transparent;
/* -webkit-text-stroke: {size} {color}; */
-webkit-text-stroke: thin PaleTurquoise;
-webkit-text-stroke: 0.2rem PaleTurquoise;
/* 👇 split stroke properties */
-webkit-text-stroke-color: PaleTurquoise;
-webkit-text-stroke-width: 0.2rem;
}
Вот демонстрация:
Вот и всё!
