This talk explores two advanced techniques that explores the absolute frontier of dynamic, context-aware design systems, hands-on.

First, we dive into contextual awareness, using variables to make components intelligently conform to their environments, including emphasis levels, size, brand, colorMode, type and much much more.

By leveraging variables creatively, we can make component consumption more intuitive and self-regulating.

Second, we unveil the absolute best implementation of slot components, while most designers rely on basic instance swapping. Real slots—like those in web technologies—offer far greater flexibility.

We will demonstrate the implementation of real <slots/> in Figma, while enforcing structural rules with a whitelist.