Session
Modern CSS Architecture (Accessible Design Systems combining Semantic HTML, @layer and --*)
The future of UI is already in the browser, if you know how to unlock it!
This talk explores how to combine semantic HTML, the @layer CSS at-rule, and CSS Custom Properties to organize code into a scalable hierarchy designed to expose intuitive CSS APIs. It showcases how to build accessible, token-first design systems that translate brand values into atomic components and color schemes (including dark/light themes and accent color support).
We'll dive into how to start from strong foundations by crafting a minimalist UI Kit, following the examples of libraries like Pico.css and Water.css, to deliver elegant interfaces with almost no CSS classes, maximizing the power of Semantic HTML to enhance accessibility and SEO.
By the end, we’ll have a cohesive, future-proof structure: start with minimalism, add layers, expose APIs, and stay accessible, letting the browser and CSS handle the heavy lifting, whether you're working on a side project or a full-scale enterprise product.
Duration: 45mins
Please note that Sessionize is not responsible for the accuracy or validity of the data provided by speakers. If you suspect this profile to be fake or spam, please let us know.
Jump to top