Email or username:

Password:

Forgot your password?
Jen's posts Post Back to profile
Top-level
Jen Simmons

`background-clip: border-area` is a great example of something that you can use today — even though it’s only supported in Safari.

Progressive enhancement techniques let you ship something using it now, while supporting all users! When other browsers add support, more users will see the result.
20 November at 16:27 | Open on front-end.social
3 comments
Jen Simmons

The most powerful part of `background-clip: border-area` might just be what you can do with a round box and conic-gradient background on its border. Especially if you animate it using `@property`!

See the code: codepen.io/jensimmons/pen/OJKB
20 November at 16:35 | Open on front-end.social
Jen Simmons

I put all of the demos in one place on CodePen.

codepen.io/collection/jONBky

Be sure to try them out in Safari Technology Preview, Safari 18.2 beta, or *perhaps* the version of Safari you have right now after enabling a flag. (The demos will tell you if your browser has support or not.)

20 November at 16:48 | Open on front-end.social
Go Up