At »Der Spiegel«, we are producing all graphics with dark mode support by default since 2022. While we make most of our standard graphics with Datawrapper (for both online and print, by the way), we had to come up with a solution for our Illustrator graphics.
In 2020, when we had a complete website relaunch, I introduced a workflow that included using ai2html to export our Illustrator-made web graphics. ai2html is an Illustrator script built by the New York Times graphics desk that converts a document’s artwork to HTML, allowing to build responsive versions of your graphics that have their text crisply rendered by the browser. Further adapting ai2html and the responsive resizer script for our dark mode needs wasn’t that hard. But since it was not an option to build the dark mode versions of our graphics manually for efficiency reasons, that alone won’t do it.
The solution
So, I started building »Darklord« – a script for Illustrator that generates dark mode versions of the artboards in a document based on a color mapping. This is how the script looks in action:
Since I started this side project alongside my editorial job, it’s always work in progress. I intend to further improve it—and we’re also open for pull requests!
You can download the latest version of the script from this GitHub repository.