How to Transform CSS only top left shapes of div

Question

I have a design that must be reshaped like the image below without having to change the letters such as using "transform: skew", because it will change the shape of the existing letters.

I dont know the name of this shapes and trying to search but the solution using skew or border transparent, and i trying by myself but the result not like what i want, please help.

You can shape with clip-path, add this in your shape css . clip-path: polygon(0 8%, 100% 0%, 100% 100%, 0% 100%); — James Allan, Apr 13 '22 at 05:10
You can get more shapes here on this editor. https://bennettfeely.com/clippy/ — James Allan, Apr 13 '22 at 05:11

score 0 · Accepted Answer · answered Apr 13 '22 at 05:27

0

I got the answer from @JamesAllan using clip-path like this

clip-path: polygon(0 21%, 100% 2%, 100% 100%, 0% 100%);

and this web Bennettfeely help me so much to make other shapes, thank you so much.

answered Apr 13 '22 at 05:27

Ivan Juliant

97
1
14

How to Transform CSS only top left shapes of div

1 Answers1