Elastic's React system behind Kibana and the company's other products. Built for search and observability screens, with its own guidance on writing in-product copy.
Why we like it
EUI is unusually candid about how it runs. Its governance document says the team would rather help than police, aims for components that cover 90% of use cases, and treats one-off components as legitimate. The team tracks them, and will only consider bringing one into the library if it matches EUI's look, has been through manual and automated accessibility testing, and works in dark mode. It also says plainly that EUI isn't generally adding new components, which is the kind of sentence most systems avoid writing.
The release process is just as deliberate. EUI applies semver strictly, so any prop change is a major, and that's why the version number is past 120. Kibana pins an exact version and upgrades the same day a release goes out, because contributors stage the Kibana changes in draft pull requests ahead of time. The content guidance has the same practical streak: four named tones with how often to use each, and word choices with reasons attached, like "edit" over "change" because it localizes better.
Where it fits
EUI fits data-dense operational React apps, the search, observability, security and admin consoles it was built for, and Kibana plugin authors above all. It suits teams who want a mature, opinionated system more than a blank, themeable kit, and the docs say as much: "By nature, EUI is very rigid."
It runs on React 17 or 18 with Emotion and a required EuiProvider, there's one theme (Borealis), and releases come roughly weekly with frequent majors. The license is Elastic License 2.0 or SSPL, so the source is public but it isn't open source in the OSI sense, and there's no current public Figma kit. For most teams, the governance and release practices are the parts to borrow, more than the components.
Ideas to borrow
- 01.
Governance
Keep a tracked register of one-off components with published criteria for promotion, so teams get an approved way out and the system gets an intake pipeline instead of silent forks.
- 02.
Process/automation
Rehearse your biggest consumer's upgrade before you release, staging its fixes in draft pull requests so it can take each version the same day.
- 03.
Accessibility practice
Turn accessibility guidance into lint rules that ship with the library, like require-table-caption, so it's enforced in consumers' code as well as written in the docs.