React
Expert
Designing a scalable design token system with CSS-in-JS and React context

Type d'évaluation

Mise en situation réelle

Analyse

Intelligence Artificielle

Compétences ciblées

react
design-tokens
theming
css-in-js
design-system

Scénario Technique

Context A design system must support multiple themes (light, dark, high-contrast) that can be switched at runtime without page reload. The Problem Theme values are currently hard-coded in component files, making it impossible to switch themes globally or support user preferences. Constraints Define design tokens (colors, spacing, typography) as structured JavaScript objects. Distribute the active theme through React context. Support runtime theme switching and persist the preference to localStorage. Integrate with a CSS-in-JS library. Expected Deliverable A React theming architecture using context-distributed design tokens, runtime theme switching, persistence, and CSS-in-JS integration.

Prêt à évaluer ce talent ?

Accédez à l'interface de test complète pour soumettre votre architecture ou votre code.

Commencer le Défis