Sometimes, we wanmt to use text as the background with CSS.
In this article, we’ll look at how to use text as the background with CSS.
How to use text as the background with CSS?
To use text as the background with CSS, we set the background-image property to a base64 URL with the svg code inside.
For instance, we write
body {
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='50px' width='120px'><text x='0' y='15' fill='red' font-size='20'>I love SVG!</text></svg>");
}
to set the background-image property to a URL with the svg content inside to render it as the background of the body element.
Conclusion
To use text as the background with CSS, we set the background-image property to a base64 URL with the svg code inside.
