open-ui.org

What is Open UI?

Open UI is a W3C Community Group working to make built-in browser controls — dropdowns, checkboxes, radio buttons, date and color pickers — styleable and extensible through standard web technologies. Its work covers specifying the component parts, states and behaviors of those controls, along with the accessibility requirements and test suites needed to keep implementations compatible. The group also builds polyfills for the extensible controls it proposes.

Who it's for

• Web developers who currently rebuild selects, pickers and toggles from scratch because native controls are hard to style consistently.
• Design system and component framework maintainers who want their custom controls to align with where the platform is heading, rather than diverging from it.
• Browser implementers and spec authors who need shared definitions and tests to ship interoperable behavior.

Why it matters in practice

Today, most design systems reimplement common controls to get full control over appearance and behavior. Open UI's stated aim is to make that reinvention unnecessary — and, for teams that still choose to build their own, to give them specifications and test suites they can rely on. The longer-term goal is a repeatable process for developing high-quality UI controls worthy of joining the web platform itself.

A concrete scenario

Suppose your team maintains a design system with a custom select. You need keyboard behavior, screen reader semantics and mobile quirks handled correctly, and you own all of it forever. Following Open UI's proposals and test suites gives you a reference point: you can check whether your behavior matches the direction the platform is taking, and reduce the amount of custom code you'll eventually have to retire.

Next step

If you want to follow or shape this work, the group points contributors to its Discord and GitHub, and publishes a full charter outlining goals and process. Start with the Open UI site to read that charter, then decide whether your interest is tracking proposals, testing your own controls against them, or contributing directly.

How does Open UI plan to make it unnecessary to reinvent built-in UI controls?

Open UI's plan is to turn today's ad-hoc, framework-specific controls into fully specified web platform features. The W3C Community Group behind Open UI states its purpose as letting developers style and extend built-in controls such as dropdowns, checkboxes, radio buttons, and date or color pickers. To get there, it intends to specify the component parts, states, and behaviors of those built-in controls, define the necessary accessibility requirements, and provide test suites that check compatibility across implementations. It also plans polyfills for its extensible controls, so developers can adopt the proposed behavior before browsers ship it natively.

How that removes the need to reinvent

The reinvention problem is not that design systems build components for fun. It is that built-in controls have historically been hard to style and extend, so teams rebuild them to get visual and behavioral control. Open UI attacks that root cause:

• Specification: A shared definition of parts, states, and behaviors means a dropdown or date picker behaves predictably, rather than each design system inventing its own semantics.
• Accessibility requirements: These are specified alongside the control, so teams do not have to rediscover keyboard, focus, and screen-reader behavior on their own.
• Test suites: Compatibility tests give browser vendors and framework authors a common target, reducing the fragmentation that pushes teams toward custom builds.
• Polyfills: Extensible controls can be used in production before native support lands, softening the migration path.
• Long-term process: The group hopes to establish a standard process for developing high-quality UI controls suitable for addition to the web platform.

What this means in practice

If you maintain a design system, the near-term value is not that you delete your components tomorrow. It is that you can align your internal API with the specified parts and states, then gradually replace custom internals as browser support and polyfills mature. A practical first step is to audit your component inventory for the controls Open UI names — dropdowns, checkboxes, radio buttons, date and color pickers — and note where your implementation diverges only because the native control could not be styled or extended. Those are the candidates where a specified, extensible control would eventually let you drop custom code. For teams that choose to keep building their own, the specifications and test suites still serve as a reference, which is the outcome Open UI explicitly anticipates for design systems.

What specific web UI components and controls is Open UI working to standardize?

Open UI, a W3C Community Group, is working to standardize the built-in web UI components and controls that developers already use but often cannot fully style or extend. From its page evidence, the named examples are:

• Dropdowns
• Checkboxes
• Radio buttons
• Date pickers
• Color pickers

The group's scope is broader than just appearance. It aims to specify the component parts, states and behaviors of these built-in controls, along with the accessibility requirements needed to make them work reliably. It also plans test suites to check compatibility across implementations and polyfills for its extensible controls.

Why this matters in practice

If you build design systems or component libraries, these are exactly the controls teams most often rebuild from scratch. A custom select or date picker is a common example: native versions are hard to style consistently, so teams ship their own, then spend years maintaining keyboard handling, focus behavior and screen-reader support. Open UI's goal is to make that reinvention unnecessary for common cases, while still giving design systems a standards-based foundation when they do need custom controls.

Next step

If you maintain a component library, review your inventory of custom controls against that list. Any component that exists mainly because the native control could not be styled or extended is a candidate to watch. You can follow progress or get involved through the group's community channels, Open UI.

How can web developers participate in or contribute to the Open UI community group?

Web developers participate in Open UI mainly by joining its community channels and contributing to the specification work itself. According to the group's home page, Open UI is a W3C Community Group whose purpose is to let developers style and extend built-in web UI controls—dropdowns, checkboxes, radio buttons, date and color pickers—by fully specifying their component parts, states, behaviors, and accessibility requirements, plus test suites and polyfills. The page explicitly invites involvement: "Get involved on Discord and Github."

Practical ways to contribute

• Join the Discord for discussion, questions, and early feedback on proposals. This is the lowest-commitment entry point and a good place to learn what is actively being debated.
• Engage on GitHub, where the actual specification, issues, and pull requests live. Useful contributions include filing well-scoped issues about control behavior or accessibility gaps, commenting on open proposals with real-world use cases, and submitting pull requests for spec text, tests, or polyfills.
• Bring implementation evidence. If you maintain a design system or component library, describe how you currently build a dropdown or date picker and where the platform falls short. That kind of concrete input is exactly what the group says it wants to make unnecessary.
• Review and test. The group's stated scope includes test suites and polyfills, so running them against your own projects and reporting failures is a genuine contribution, not just consuming output.
• Read the charter first. The page points to a full charter outlining goals and process; reading it tells you which workstream your interest fits and how decisions get made.

A concrete next step

Pick one built-in control you have had to rebuild—say, a <select> replacement—and write a short GitHub issue describing the specific states, styling hooks, and accessibility behavior you needed. Then introduce yourself in Discord and link the issue.

Decision criterion

If you want influence over direction, contribute to specifications and tests on GitHub. If you mainly want to stay informed and give quick feedback, Discord alone is enough to start.

For related standards work, see W3C and, for implementation discussion across browsers, GitHub.

What are the long-term goals of Open UI for the web platform?

Open UI's long-term goal is to make high-quality, fully specified UI controls part of the web platform itself, so developers no longer have to rebuild common controls in every framework or design system. As a W3C Community Group, it works on specifying the component parts, states and behaviors of built-in controls—dropdowns, checkboxes, radio buttons, date and color pickers—along with the accessibility requirements and test suites needed to keep implementations compatible.

A second goal is extensibility: giving developers a standards-based way to style and extend those built-in controls, with polyfills to demonstrate and test the approach before it lands in browsers. Open UI also aims to establish a repeatable process for developing and evaluating new UI controls for the platform, rather than letting each one arrive ad hoc.

What this means in practice

• If you maintain a design system: the payoff is fewer bespoke, inaccessible controls to maintain. Your components could eventually build on standardized primitives instead of reimplementing select, checkbox and picker behavior from scratch.
• If you build product UI: you get more consistent behavior and accessibility across browsers, with less per-project work on keyboard handling, focus management and ARIA.
• If you contribute to the platform: the specifications and test suites are the concrete artifacts to follow, and design systems that still need custom controls are expected to benefit from them.

Next step: if your team is deciding whether to adopt or track this work, check whether a control you're currently hand-rolling (a custom select or date picker is the usual candidate) is already covered by an Open UI proposal. If it is, prototype against the polyfill and keep your markup close to the proposed structure, so migration to the native control is cheaper later. The group's charter and community channels are the places to follow progress or get involved: Open UI.

How will design systems and component frameworks benefit from Open UI's specifications and test suites?

Design systems and component frameworks would benefit mainly by not having to reinvent the browser's built-in controls from scratch. Open UI's stated aim is to specify the parts, states and behaviors of controls such as dropdowns, checkboxes, radio buttons and date or color pickers, along with accessibility requirements and test suites for compatibility. For a design system, that is reusable groundwork: instead of each team independently deciding what "open", "disabled" or "invalid" should mean for a select, those definitions come from a shared specification.

Where the practical value shows up

• Styling built-in controls. If browsers expose the internal structure and states of native controls, a design system can theme them directly rather than replacing them with a div-and-JavaScript imitation.
• Behavioral consistency. A test suite gives framework authors something concrete to check against, so a component behaves the same way across implementations and browsers.
• Accessibility. Because accessibility requirements are part of the specification work, teams that currently hand-audit every custom control can lean on defined expectations.
• Interoperability. Polyfills mentioned in the project's materials give frameworks a path to adopt proposed behavior before it ships natively.

There is a trade-off. A framework that competes on its distinctive, fully custom component set may lose some differentiation if native controls become broadly styleable — the advantage shifts from "we built a better dropdown" to "we integrate the standard one well." Frameworks that mainly want to stop maintaining bespoke controls gain the most.

If you maintain a design system, a useful next step is to inventory how many components exist only because native controls could not be styled, then follow the group's work through Open UI to see which of those are being specified.