STstemcc·Dec 11, 2022
In Elastic UI – Component library for data-driven web appselastic
eui
TypeScript2019–2022
elastic / eui
eui
Elastic UI Framework 🙌
6Distinct people
7Mentions
0Explicit recommenders
6.4KGitHub stars
What to know before exploring
What it is
Elastic UI Framework 🙌
GitHub
Where it is used
No documented product use has been verified yet.
What people are saying
No recommendation phrase was found in the indexed comments.
No classified warning is attached to this page. Read the discussions before treating silence as approval.
Also in these discussions
No other repository is repeatedly linked in the same discussions.
This week on Hacker News
Nov 7–Nov 14 UTC · Direct repository links and separately labeled related project stories. Indexed through 11/14/2026, 1:49:46 PM UTC.
No direct repository links were found in the indexed HN discussions over the past seven days. Older discussions are available below.
Mentions over time
HN mentions by year7 dated mentions
Observed mentions: 2019-12-30 23:25:41 UTC to 2022-12-11 20:03:06 UTC.
Counts come from the repository’s dated source evidence. Index cutoff: 2026-11-02 08:16:59 UTC.
View mention counts and date ranges
| Period | Start (UTC) | End (exclusive, UTC) | Mentions | Submissions | Comments |
|---|---|---|---|---|---|
| 2019 | 2019-01-01 00:00:00 UTC | 2020-01-01 00:00:00 UTC | 1 | 0 | 1 |
| 2020 | 2020-01-01 00:00:00 UTC | 2021-01-01 00:00:00 UTC | 2 | 0 | 2 |
| 2021 | 2021-01-01 00:00:00 UTC | 2022-01-01 00:00:00 UTC | 1 | 0 | 1 |
| 2022 | 2022-01-01 00:00:00 UTC | 2023-01-01 00:00:00 UTC | 3 | 1 | 2 |
What Hacker News says
7 sourcesNice framework, but the license is oh so strange...
https://github.com/elastic/eui/blob/main/licenses/ELASTIC-LI...
In Elastic UI – design library in use at Elastic to build internal productsI understand the reasoning behind the license change for elastic search / kibana and the rest of the server side products. But why did they have to change the license for Eui [0]. It is a real shame because it is amazing for building admin UIs.
[0] https://github.com/elastic/eui/
In OpenSearch 1.0Mostly it's a combination of tools. We write a lot of custom color functions (using Sass). You can check the src here[0]. A common one we'll use is makeHighContrastColor(), which given two colors will automatically make the first one a 4.5 AA accessible contrast by adding tint/shade.
For palette generation, we do a lot of our work with tools like chroma.js[1] which can help with some colorblind math.
[0]: https://github.com/elastic/eui/blob/master/src/global_stylin...
[1]: https://gka.github.io/palettes/#/9|s|00429d,96ffea,ffffe0|ff...
In Chakra UI – Modular and accessible UI components for React appsI work on Elastic's UI[1][2], which is Apache 2 licensed. We look a little different than Ant, and are more tailored to data projects and content creation since we use it for Kibana. That means we have lots of tables, autocompleters, sliders, data grids, and specialized form controls.
All of our components are built for keyboard / screenreader support and accessibility was one of our primary goals since the beginning. We take it serious and it's baked into our review process. It's fairly mature and is now two and a half years old with a solid team working on it full time. At the very least you might find some ideas for your projects. It's also TypeScript-backed and themable through a Sass layer with native dark mode support.
We welcome contributions and if there's any students out there thinking about hacking on a component library for su
Read the rest
mmer of code you can find some projects over here[3].
Other projects out there similar to ours that are pretty mature are Microsoft's Fabric[4] and Atalassian's Atlas Kit[5]. Both of which are open source as well. Generally we tend to have more features, and they might be a little easier to theme or modularize. Chakra UI[6] is a new comer that is smaller, but people seem to like as well. There are a lot of options these days and most of them are tailored towards a certain use case, since it's hard to target everything.
I research this stuff a lot so if anyone has any questions about component libs give a yell.
[1]: https://github.com/elastic/eui
[2]: https://elastic.github.io/eui/#/
[3]: https://github.com/elastic/gsoc
[4]: https://developer.microsoft.com/en-us/fabric#/
[5]: https://atlaskit.atlassian.com/
[6]: https://chakra-ui.com/
Simple example: I worked on an app where I wanted to use the @elastic/eui UI framework[1]. That framework (a fairly popular/vetted one) used some DOM manipulations somewhere deep for some thing or other and Next broke with some bizarre error. Had to find this snippet in someone's reported (Gatsby) issue and stick it in my next.config.js file:
/**
* We have to force the bundling of @elastic/eui and react-ace
* as Gatsby, then all loaders below will match and avoid HTMLElement issues
*/
config.externals = config.externals.map(fn => {
return (context, request, callback) => {
if (request.indexOf('@elastic/eui') > -1 || request.indexOf('react-ace') > -1) {
return callback();
}
return fn(context, request, callback);
};
});
config.module.rule
Read the rest
s.push(
{
test: /react-ace/,
use: 'null-loader',
},
);
And this was just my first SSR issue. Definitely not "out of the box."
[1] https://github.com/elastic/eui