Frontend Engineer building design systems — from tokens to components to published packages.
I lead the frontend design system and developer tooling at Hyundai Capital, and maintain Magic UI. Outside of code, I DJ and explore music. Listen here.
- Core: TypeScript, React, Next.js, Vue
- Design Systems: Design Tokens, Style Dictionary, Storybook, CSS, Motion
- Tooling: Vite, Codemods, Package Publishing (publint, attw), Bundle Optimization
Hyundai Capital — Frontend Engineer (2023.01 ~ Present)
Lead the frontend design system and developer tooling.
- Rebuilt the component library on ESM for tree shaking, cutting TBT from 900ms to 10ms.
- Reduced design-system CSS from 4.7MB to 133KB.
- Shipped codemods that migrated 500+ files with zero manual edits.
- SSAFY (2022.01 ~ 2022.12)
Maintainer of Magic UI and Magic UI MCP. Creator of ui-layouts MCP.
- Design Token Tooling — Added configurable sort options (by name or custom comparators) for formatted variables in Style Dictionary.
- Package Reliability — Added pre-publish validation with publint and attw, uncovering and fixing packaging issues across four packages in SIPE.
- Docs Theming — Introduced centralized primitive and semantic color tokens in ui-layouts.
- Safari / iOS Compatibility — Replaced SVG
foreignObjectvideo rendering with DOM overlays to resolve iOS rendering issues in Magic UI (#780). - React Rendering Stability — Fixed a hydration mismatch and a ResizeObserver effect loop in Magic UI's Animated Grid Pattern.
- TypeScript Type Inference — Fixed type inference for all-uppercase keys (e.g.
ID→id) intoCamelCaseKeysin es-toolkit. - MCP Architecture — Introduced generic registry discovery tools while preserving existing APIs in Magic UI MCP.
View all contributions on GitHub
- Vague Frequency Labs — Creative website for a music-focused brand.
- Celebrate Agency — DJ agency website.
- Payday Records — Music label website.