In today's haunted GUI Challenge, @AdamArgyleInk live codes CSS clip-path transitions, demo's some rad effects, and covers the gotchas. If you don't know clip-path, you will by the end.
Chapters:
- 0:00 - Introduction
- 0:41 - Overview
- 1:55 - Debugging Corner
- 2:20 - Reduced motion
- 4:55 - Chrometober
- 6:05 - clip-path syntax
- 14:20 - square transitions
- 19:25 - transition.style
- 21:02 - Outro
Resources:
- Try a demo → https://goo.gle/3DxkVEH
- Get the source → https://goo.gle/3f7fm6n
- Transition.style → https://goo.gle/3W8nhkL
Watch more GUI Challenges → https://goo.gle/GUIchallenges
Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs