dsui, a design system written for Korean first

dsui is a library of React components, blocks and themes for building Korean web apps. Color, spacing, corners, shadows and motion are all set as tokens, and components read only those tokens. Change a token and the whole screen changes with it.

It starts from 105 components and 22 blocks of Arc's free library, published under the MIT license. We rewrote the copy in a polite Korean tone, set dates and numbers to ko-KR and Asia/Seoul, and let themes change icons, sound effects and motion. With the devs7udio items that came before, it now has 114 components, 25 blocks and 2 themes.

• Catalog and demos: All 127 items, 105 components and 22 blocks, have a demo you can try. Each item has controls, source and a Markdown version.
• Themes: There is base, the reference theme, and the seasonal themes (Halloween, Seollal, Chuseok, Christmas) built on top of it. Pick a theme and the colors and corners in the previews change right away.
• Install: A shadcn-style registry is open at /r. One npx shadcn command brings in a component along with the shared files it needs.
• Docs: The introduction, install guide, making a theme, AI and MCP, and the changelog are in the docs.
• AI tools: With llms.txt, a Markdown page per item and an MCP server that takes a key, AI tools can search dsui and fetch the source.

Themes sit on top of tokens. Fixing colors one component at a time means more work with every new theme. So components read only meaning tokens like --accent and --surface, and a theme changes only the token values. A new theme inherits base and writes only the values it wants to change.

We checked installs in an empty app. A registry that only works in our own repository is not much use. We installed a button, a block and a theme in a fresh Next.js app, and checked that the theme's light and dark values landed in the right place.

We opened every demo in light and dark. A check script opens each demo in light and dark mode. It counts a run as failed if it throws an error or the screen is blank.

We aligned copy and interaction rules in one pass. All copy moved to the polite Korean tone. Input fields fill their surface with the accent color when they get focus. Buttons, tabs, switches and similar components play sound effects, and people can turn them off.

The header, footer, buttons and input fields of the devs7udio site are all dsui items. We find gaps while building the site, and the fixes go back into the library.