Kilian Valkhof

Building tools that make developers awesome.

I want my own media queries in browsers

CSS & HTML, Web, 19 October 2020

We’re on the verge of a whole lot of new CSS media queries becoming available. But if you’re a developer that wants to get a head start and try them out, you’re out of luck. Browsers are prototyping them one by one before making them available and we as developers have to wait.

Full bleed layout using simple CSS

CSS & HTML, 6 October 2020

There are many different ways to achieve the same layout in CSS and HTML. Some are now frowned upon, like tables or floats, and others tend to overlap somewhat, but have a clear specific purpose, like Flexbox and Grid. But CSS has another layout engine, and it’s one that has been part of CSS since the beginning: Flow layout. And it can do a lot.

Beautiful CSS 3D Transform Examples

CSS & HTML, 5 October 2020

CSS 3D transforms create depth and visually interesting elements on your page using perspective. I use them on the Polypane website and whenever I see them in the wild they look fun and clever. Unfortunately I don’t see them being used a whole lot.

Supercharging <input type=number>

Javascript, 11 August 2020

The number input type provides a nice way for to deal with numbers. You can set bounds with the min and max attributes and users can press up and down to go add or remove 1, or if you add the step attribute, go up or down by a step. But what if we want to let the user go up or down with different step sizes?

Responsive design in 2020: Recording of my Halfstack Conference talk

CSS & HTML, 22 June 2020

At Halfstack Conf in May I gave a presentation on what I think responsive design should be about in 2020 and what it will be about going forward: responding not just to static device properties like width and height but also to user preferences like preferring dark mode or reduced motion. The recording of it is out now, check it here:

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

I develop more software and tools:

Superposition

Use the design system you already have

FromScratch

A cross-platform, simple and smart autosaving scratchpad.

A Messenger Adventure!

Go on a text adventure in Facebook Messenger.

Electron
Newsletter

The latest Electron news, articles, apps and interviews.

Trimage

Drag-and-drop lossless compression of PNG and JPG images for web.

Messenger Demo Viewer

Demo your (bot) interactions on Messenger.