Applying Radius to Clip Path. Need Help

Hi everyone I need help to create this but I failed every time to create this in html and css I dont want to use svg Instead I use clip path but no radius is applied to it please give me the solution
No description
4 Replies
Dominant Aether
Dominant Aether11mo ago
please help
clevermissfox
clevermissfox11mo ago
You say no svg on your clip-path, are you just using a hand-written path then? You need those curves in your clip-path because it’s clipping off your box, so any border-radius is clipped. This has been a common question for on here for this shape, you may want to search “inverted border radius” and see what others have done. I like to use an svg in the shape I want for the clip path but other solutions I’ve seen are using a pseudo element on top to make that curve in
Jochem
Jochem11mo ago
Kevin Powell
YouTube
Creating an inverted border-radius with CSS
The other day on Twitter, @FlorinPop pulled me into a conversation, wondering how to create inverted, round corners. Mask-image was probably the easy answer, but after someone in the thread said that making an SVG mask felt like overkill, I had to try and see if I could think of an alternative way! 🔗 Links ✅ The original tweet: https://twi...
Jochem
Jochem11mo ago
keep in mind though, it's a bit of a challenge video. Pay attention to what he says is and isn't good practice, and honestly consider just using an SVG, it's probably the best solution.
Want results from more Discord servers?
Add your server