Kilian Valkhof

Front-end & user experience developer, Jedi.

Writing CSS in Dutch using PostCSS

CSS & HTML, 3 July 2016, 1

Many years ago there were a couple of developers that made a Dutch version of CSS but unfortunately that version got lost to history. When I encountered a PostCSS plugin to translate CSS to German, I decided to create a new Dutch version of CSS: postcss-dutch-stylesheets.

PostCSS-Dutch-stylesheets is a port of postcss-german-stylesheets that allows you to write CSS like this:

.foo {
    hoogte: 300px;
    ondermarge: 10px;
    tekstgrootte: 20px !belangrijk;
    achtergrondkleur: zwart;
    kleur: wit;
}

And it will turn it into

.foo {
    height: 300px;
    margin-bottom: 10px;
    font-size: 20px !important;
    background-color: black;
    color: white;
}

This was mostly something I did for fun in a couple of hours, but I suppose there might be some merit in having a translation of some of the CSS concepts if only for Dutch developers to better understand what each property does.

The german version had both a published npm package and tests running on Travis, so I made sure I added both of those (which was a breeze!). Getting postcss-dutch-stylesheets is as easy as:

 $ npm install postcss-dutch-stylesheets

Code is up on Github, feel free to contribute!

Polypane browser for responsive web development and design Hi, I'm Kilian. I make my living building Polypane, the browser for responsive web development and design. If you're reading this site, that's probably interesting to you. Please try it out!