Blog
Tips for responsive design & developer tools
Page 1 of 6
The complete guide to CSS media queries
Media queries are what make modern responsive design possible. With them you can set different styling based on things like a users screen size, device capabilities or user preferences. But how do they work, which ones…
:where() :is() :has()? New CSS selectors that make your life easier
When people talk about CSS complexity, a major contributor to that is CSS specificity, or writing effective CSS selectors. The more you add to a CSS selector, the more precise it is, but also, the more specific it is, so…
Polypane 9: Screenshot editor, structured data support and new debug tools
Polypane 9 ships with a completely new way of making and editing screenshots, support for different types of structured data in the Meta panel, new debug tools and many improvements to the outline and elements panel as…
Always open localhost in your development browser
Many development servers will automatically open their URL when you launch them, and without configuration that happens in your default browser. If you use a separate development browser, like Polypane, that can be…
Forced colors explained: A practical guide
Forced colors is a CSS media query that when active radically changes the way your site looks, without any of your input. In this article we'll explore where it comes from, how it changes your site and how you can adapt…
Create a Polypane account with GitHub
Today we launch the option to start a Polypane trial with GitHub Auth. When you register for a Polypane trial click the "Register with GitHub" button to authenticate with Github instead of creating a username and…
Developing for color blindness with Polypane
While you might know about color blindness, it can be difficult to imagine being color blind. In fact, many people think it means you can't see any color at all, which is not true. Full color blindness, or "Achromatopsia…
Polypane 8.1: Resizable element tree, disable JS feature, new debug tools and more
Polypane 8.1 comes with two often requested features: The tree view in the elements panel is now resizable so you can adapt it to your preferences, and there is a new Disable JS debug tool that disables JavaScript in a…
How we made the State of CSS more responsive and accessible
Each year, the state of CSS takes a global survey of the CSS landscape. Its results are highly regarded and influence browsers, toolmakers and web developers around the world. So I (Kilian) was super honored when I was…
Polypane is now part of the GitHub Education Intro to Web Dev pack
We are proud to announce that Polypane is now part of GitHub Education Intro to Web Dev . The response to Polypane being part of the Github Student Developer Pack has been phenomenal. Seeing Polypane be used across the…
Polypane 8: better Elements Inspector, new syncing features, Chromium 98 and more
Polypane 8 comes with a better Elements inspector, big performance improvements, Chromium 98 and many other new and improved features, like forced colors emulation, focus state sync, ARM support, UI improvement, a new…
The breakpoints we tested in 2021, and the ones to test in 2022
Which screen sizes to design, build and test on is a perennial topic in web development. While well-built responsive websites will work at any size, during development it's easier to use a small number of sizes to check…