Давно хотел сделать эффект для текста с фоновым изображением, очень красиво смотрится. Ниже оставляю пример, как легко и быстро это реализовать используя только HTML и CSS.

Реализуется такой эффект благодаря CSS свойству background-clip: text, которое определяет как должен отображаться фон.

<div class="text-wrapper">
    <h3>САНЯ</h3>
</div>

.text-wrapper{
	text-align: center;
}
.text-wrapper h3{
	font-size: 10vw;
        letter-spacing: 20px;
	color: rgba(255,255,255, 0.01);
	-webkit-text-stroke: 10px rgba(255,255,255,0.01);
	background-color: #fff;
	background-repeat: no-repeat;
	background-image: url(https://img2.akspic.ru/image/143943-cvetochnyj_dizajn-uzor-narodnaya_muzyka-tkan-zhivopis-1366x768.jpg);
	background-position: 50% 50%;
	-moz-background-size: 100%;
	background-size: 100%;
       
        /*ключевое свойство*/
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
}