How do you make a slanted highlighter on a text block?

Niels_Koelmeyer · February 27, 2020, 10:02am

Hi

I’m trying to achieve text highlighter effect on a piece of text like in this screen shot

So far, I’ve been using spans. I can apply an appropriate background color to the piece of text I want to highlight. However, I can’t figure out how to achieve the slant/tilt of the color. Been trying to apply skew to the span but it has no effect.

Does anybody know how I might achieve a slanted highlighter effect?

Thanks@

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Jonathan_Holden · February 27, 2020, 1:35pm

can you share the read only link?

Niels_Koelmeyer · February 28, 2020, 8:42am

Sure: https://preview.webflow.com/preview/mytutor-mental-health-report-2020?utm_medium=preview_link&utm_source=designer&utm_content=mytutor-mental-health-report-2020&preview=c76c7f0512e622166e9a3783720840e6&mode=preview

TheCat · February 28, 2020, 6:35pm

I would just duplicate your angle Div (purple skew) behind the Text Span? Just set your Zs accordingly.