CSS3 Isometric Text Demo
CSS3 Isometric Text Effect created by Duncan Midwinter. This 3D text effect is created using 2D transforms so it works in all the major browsers. Skew transform and a small blur by using text-shadow
is applied to the h1
tag to make it look like a shadow. The standing text is created from the :after
pseudo element of the h1
tag and the text is inserted using content
property.
Similar to the shadow, the paragraph is also positioned by using skew transform to make it look like 3D. Take a look at the code to understand how it works.