Create tilt or slant text effect in Beaver Builder

Want to make normal text more fancy without resorting to image version of the text? Give “tilt” or “slant” effect to text using few lines of CSS for cooler looking text on your Beaver websites.

Preview of left and right tilt text effect

Tilt text effect in beaver builder

CSS to make tilt or slant text

1. Add the following CSS code in style.css of the child or CSS box on a specific (Tools > Layout CSS / Javascript).

2. Now open a new or existing page in the “Beaver Builder” mode. Then drag “Headline” module into your Beaver layout.

3. Type headline text and then go to “Advanced” tab. Now type class name tilt-text-left to make text slant or tilt to left side. Use class tilt-text-right for right direction tilt or slant.

tilt text effect css class

Quick, cool and simple – right?

Davinder Singh Kainth

About Davinder Singh Kainth

Davinder loves creating and implementing online spaces. He has over a decade of experience reaching corners of: design, development, blogging and SEO. Learn more at

1 Comment

  1. Diane on October 3, 2017 at 6:27 pm

    Thank you Davinder! Exactly what I was looking for.

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.