CSS is rapidly evolving now. From just announcing css variables to now having cascade layers, scroll-driven animations without the need of any Js, CSS has really come a long way.
Below are some of the new concepts you can explore, learn about. I’ll writing posts on each of them very soon.
Simple (Basic concepts, straightforward usage):
- CSS Variables
- color-scheme: light dark
- text-wrap: balance
- :focus-visible
- :user-valid and :user-invalid
- :where and :is
- Transition support for display: block/none
- margin-trim
- max-content
Intermediate (Requires more understanding):
- :has
- CSS Nesting
- CSS Layers
- View Transitions
- color mixing
- animating height: auto
- @property
- Scoping
Complex (Advanced concepts, multiple moving parts):
- Scroll Driven Animations
- Container Queries – size
- Container Queries – style
- Subgrid
- @when
- @else
- Anchor Positioning
- <selectmenu>