Behive is a full-scale design system built as an independent project during a period of intentional skill development. It started as a personal challenge, to design a coherent, production-ready system from scratch, and evolved into a distributable product targeting freelancers, indie designers, and small product teams who work primarily in Figma and want a production-ready foundation without the complexity of a coded component library. The name and concept are built around a single idea: a hive is where individual pieces come together into something structurally sound. That's what a good design system does.
Most publicly available design systems are either too opinionated (built for a specific product) or too generic (a component kit without a token strategy or brand story).
Behive was designed to fill that gap.
- Build a complete, documented design system that could stand as a professional portfolio artifact
- Establish a token architecture that scales across themes and breakpoints
- Create a component library that demonstrates real design system thinking, not just a UI kit.
- Delivered as a Figma-native system tokens, components, and documentation fully contained within the file, with code integration scoped to a future v2.
- Package it for distribution via Figma Community (free lite tier) and Gumroad (full system, donation based payment)
The system is built on four variable collections in Figma, structured in a deliberate hierarchy:
This separation means the system can be themed (dark mode, brand variants) by swapping the Brand collection, everything downstream updates automatically. That's the kind of architectural decision that distinguishes a design system from a component kit.
The ghost variable problem. During development, a persistent variable reference issue surfaced. Some components were pulling values from another design system library variables rather than Behive ones. Tracked down through Figma's developer console using custom JavaScript scripts to audit variable bindings across the entire file. Resolved by systematically relinking affected components to the correct Behive collections.
This kind of deep-system debugging is invisible in the final output, but it's exactly the work that makes a design system trustworthy at scale.
- Core component library and token system complete
- Brand identity and documentation framework established
- Preparing for dual distribution: Figma Community (lite, visibility) + Gumroad (full system, paid)
- Framer presentation site in planning - the portfolio itself will be built on Behive components, making it a live proof-of-concept
Behive isn't a client project - it's a deliberate, self-directed proof of competence.
Login and onboarding screens designed using Behive components, light and dark themes.
