Monolithic or multiple libraries for cross-platform design system?
This tests cross-platform design system architecture. Pick multiple interconnected libraries, centralize tokens in a shared primitive layer, and branch platform components downstream. Red flag: one monolithic file ignoring native rendering constraints.
What's really being asked
Your ability to separate concerns between universal design language and platform implementation realities. Interviewers want to see that you understand tokens are platform-agnostic while components must respect native rendering engines, accessibility APIs, and interaction patterns. They also want evidence that you have scaled systems across organizational boundaries.
The full answer
First, choose multiple interconnected libraries rather than a monolith. Structure them as a core token library feeding separate web, iOS, and Android component libraries. Second, define primitive tokens like color, spacing, typography, and elevation in the shared layer using platform-agnostic formats such as JSON or Style Dictionary. Third, let each platform library consume those tokens and build components using native primitives, for example SwiftUI or Compose, so the output respects platform conventions and accessibility. Fourth, establish governance: version the token package independently, publish changes through a CI pipeline, and require platform leads to approve token updates that affect component contracts. Fifth, discuss how to handle shared assets like icons through a unified pipeline while allowing platform-specific overrides for touch targets or motion curves.
The mistakes people make
A monolithic single library is almost always the wrong answer because it forces lowest-common-denominator abstractions and breaks native rendering. Another red flag is treating tokens and components as the same layer, which leads to cascading breaking changes when a color value shifts. Avoid answers that ignore dependency management or suggest manual copy-paste of values between platforms. Also be wary of claiming that React Native or Flutter eliminates the need for platform separation; the question asks about web, iOS, and Android specifically.
What usually comes next
How do you handle a token change that breaks contrast ratios on one platform but not another? What is your strategy when iOS Human Interface Guidelines and Material Design conflict with the shared token values? How do you prevent version drift where one platform lags months behind the token library? What is your process for adding a new token, from design tool to production code?
A concrete example
Imagine migrating from hex colors to an OKLCH color space. With a shared token library, you update the JSON source and regenerate platform outputs. Web consumes it via CSS custom properties, iOS via SwiftUI Color extensions generated from the same schema, and Android via Compose color objects. Each platform team updates their component library dependency, runs visual regression tests against their native components, and ships independently. If Android needs a slightly different surface tint for elevation due to Material You dynamics, the token remains shared but the component layer applies the platform-specific override without polluting the global token set.
Interview question
When architecting a design system across web, iOS, and Android, what is the primary advantage of using a shared token library that feeds separate platform component libraries instead of a single monolithic package?
- a.It lets each platform respect native rendering engines and accessibility APIs while keeping tokens synchronized.Correct
- b.It eliminates the need for versioning because tokens and components are always released together.
- c.It allows designers to update production tokens directly in JSON without engineering or CI involvement.
- d.It guarantees that all platforms render identical pixel-perfect UI by using the same native components.
Why? this is the answer
The card emphasizes that separate platform libraries should consume shared tokens and build components with native primitives to respect platform conventions and accessibility. Option D is tempting because consistency is often desired, but the architecture intentionally avoids lowest-common-denominator abstractions in favor of native rendering.
Just read this? Test yourself on what you have been reading.
- #design-systems
- #cross-platform
- #tokens
- #architecture
- #ui-engineering
Put your scrolling time to good use
Learn one idea, try a quiz and save useful cards for revision. Tezvyn makes it easy to learn and stay current in your tech field, a few minutes at a time.
The iPhone app is on the way
We are building it. Until it lands, nothing here is held back from you: every interview card, your saved cards, streaks and the job board all work in Safari, plus hundreds of free practice quizzes of thirty questions each. Sign in and it all carries over to the app the day it arrives.
Want it as an icon? Tap Share at the bottom of Safari, then Add to Home Screen. It opens full screen and the cards you have read stay available offline.
We are hiring for this. Open roles that interview on design-systems — each one lists the topics its interview covers.
See open roles