RSS FeedTwitterMastodonBlueskyShare IconHeart IconGithub IconArrow IconClock IconGUI Challenges IconHome IconNote IconBlog IconCSS IconJS IconHTML IconShows IconOpen Source Software IconSpeaking IconTools IconShuffle IconNext IconPrevious IconCalendar IconCalendar Edit IconNotebook IconObservable Notebooks IconSlash IconGoogle G Icon
A cartoon skull with a hotpink hat on.
atom@argyleink
notecss

Squircles with clip-path: shape(), while we wait for corner-shape: squircle.

Vote for corner-shape in Interop 2026 or give this little GUI a peep from Zoran.

Try on Codepen

An example squircle

2 comments #

51likes
10reposts
  • jamie kerber ????????????
  • Andrew ????
  • Josh W. Comeau
  • mrtnvh
  • sh03
  • Bundyo
  • Lennart
  • Roni Rolle Laukkarinen
  • adrien
  • Jonathan Dallas

Join the conversation on

you get a squircle, you get a squircle, i get a squirtle nerdy.dev/squircles #css
Adam ArgyleAdam Argyle
If you inspect my site, you can find squircley progressive enhancement, aka, I'm using it already cuz why not!?
Adam ArgyleAdam Argyle