Tech stories

Introducing Lume: Adyen's very own data viz library is now open-source

Adyen is proud to announce that Lume, our Vue-based data visualization library, has gone open-source!

October 20, 2023
 ·  5 minutes

Lume, our Vue-based data visualization library, has gone open-source! Lume combines design guidelines for creating data visualizations that tell stories, and developer components that implement them. It’s heavily based on our own experience working with financial products and informed by industry best practices.

Lume is: sleek and informed

Working on data visualizations at Adyen informed our initial selection process. We started by making a list of all the data visualizations that are used on our platform, and then decided that those would be the first ones we wanted to build. Having been built in-house at a fintech company, developers who work with financial data will find Lume to be very useful. Right now the library consists of:

  • Alluvial diagram

  • Bar chart

  • Grouped bar chart

  • Line chart

  • Sparkline chart

  • Stacked bar chart

Creating new charts and diagrams with Lume is a breeze, because not much configuration is needed—even though we do provide a backdoor for customization. Our clear design guidelines make sure that our code is sleek and easy to use, built on solid default settings. We knew up front what parts should be flexible and what parts should be set in stone. Having our development decisions reflect these principles makes sure that the codebase is opinionated as well.

Lume is: easy to use for building your own charts

Lume is a great addition to the data visualization space, because it fuses the power of the Vue reactive framework with the capabilities of the D3.js library. For developers at Adyen, it was already available, ensuring that the way we create and implement data visualizations is consistent across all our various products. The library now is advanced enough to make it publicly available by open-sourcing. Although our guidelines are opinionated, we did want to provide a nice and componentized library. Internally, this was one of the problems we as developers continually faced: most charts we made would serve a single purpose, but in the rush of building things we didn’t have the opportunity to split it up into smaller, reusable components. With Lume, we took the effort to get this right. Now it’s much easier to build new or hybrid charts, making use of the more elementary components that we provide. Charts are super easy to set up and only require a few lines of code, as seen in the image below!

Lume is: a household name with your help

This is also an invitation: we want everybody who is interested to start contributing! We are confident that Lume can help out a lot of developers who use Vue and are looking for a solid data visualization library. Going open-source is exciting, because you get to share what you created and you can iterate on the needs of a broader community.  That’s because we still have plenty of areas to improve in: from developing new charts and diagrams, to supporting accessibility. We would love to see Lume become a household name for all developers working with data visualizations, so we need all the help we can get.

If you’re interested in contributing to the library, you can check out the Lume website and the Lume GitHub repository. We hope to see you there!

Fresh insights, straight to your inbox

By submitting your information you confirm that you have read Adyen's Privacy Policy and agree to the use of your data in all Adyen communications.