Author: | twodogstar |
---|---|
Views Total: | 1,341 views |
Official Page: | Go to website |
Last Update: | June 21, 2014 |
License: | Unknown |
Preview:

Description:
A cool text effect created by yoksel that fill your text with an animated GIF background, based on SVG and CSS stroke properties.
How to use it:
Create an SVG element that contains your text and a SVG pattern.
<svg> <pattern id="pt--demo" viewBox="0 0 256 256" width="256" height="256" patternUnits="userSpaceOnUse"> <image xlink:href="1.gif" width="256" height="256"/> </pattern> <text x="50%" y="155" class="t--demo" text-anchor="middle">Demo</text> </svg>
Fill the text with the SVG pattern made up from images.
text { stroke-width: 10; stroke-opacity: .5; font-size: 12em; } .t--demo { fill: url(#pt--demo); stroke: #004384; }