Lens is the design system Loom uses to build its own product, pairing components (buttons, dropdowns, modals, navigation) and foundations (color, typography, spacing) with an installable npm package and a matching Figma library.
Because designers and developers reference the exact same component set, design handoff becomes a conversation about which existing pattern to reuse rather than a back-and-forth over new specs, and atomic CSS classes give developers granular styling control beyond the prebuilt components.
Design system engineers studying how to keep design (Figma) and code (npm package) genuinely synchronized rather than drifting apart over time.
It's installable directly via the @loomhq/lens npm package, so components can be adopted in a real project, not merely studied as reference.
The design system for Loom products.
