How to achieve this Div shape?

Magic

Posting Freak
Oct 11, 2012
1,026
196
Hey,

Is there a way to get a div to be shaped like this through clipping or some other way?

Screen-Shot-2019-10-05-at-2-47-20-PM.png


Cheers
 

Magic

Posting Freak
Oct 11, 2012
1,026
196
You can do that with transform ( )

And clip-path ( )
Is it possible to make those curves? I've seen people make shapes and clip paths for rigid shapes but haven't found any code for an example with smooth curves like the image above.
 

Magic

Posting Freak
Oct 11, 2012
1,026
196
Is anyone able to pose that question with that picture on stack overflow? I am not allowed to post pictures yet due to my reputation being too low.
 

RastaLulz

fight teh power
Staff member
May 3, 2010
3,926
3,920
How did you create the image? Can you convert it to an SVG? That way you'd accomplish the same as if you were to use CSS, as it would look crisp at any width (which I assume is your goal). You would then just use `background-image` to display it in a `div`.
 

Magic

Posting Freak
Oct 11, 2012
1,026
196
How did you create the image? Can you convert it to an SVG? That way you'd accomplish the same as if you were to use CSS, as it would look crisp at any width (which I assume is your goal). You would then just use `background-image` to display it in a `div`.

Good point, I made it using Adobe XD so that might be an option. I'll give it a go.

EDIT: @bigdawg XD allowed me to export it as an SVG and I added it as a background. Cheers for the tip
 
Last edited:

Users who are viewing this thread

Top