Blog
Tips for responsive design & developer tools
Page 6 of 10
The EyeDropper API: Pick colors from anywhere on your screen
With the new EyeDropper API in Chromium, websites can let visitors pick colors from anywhere on their screen, adding another feature to the web that used to require hacky solutions and is now just a few lines of code…
Polypane 7
Polypane 7 adds a new color picker tool, support for pseudo-elements and pseudo-classes in the Elements panel, new Web Vitals data and visualisations, an integration with Marker.io, new simulators, an update to Chromium…
Find and fix accessibility issues with Polypane
At Polypane, accessibility is one of the three core areas we focus on, along with performance and responsive design. If you're not familiar with Polypane, it's a web browser specifically for web developers. It has all…
How TeliportMe is moving to the web with Polypane
We interviewed Vineet Devaiah, the CEO of TeliportMe on their move to the web and how Polypane is helping them do this. Hey Vineet, so good to talk to you! Can you introduce us to TeliportMe ? Yeah, Teliportme is the…
How to find the cause of horizontal scrollbars
One of the most time consuming issues when it comes to web development is debugging horizontal scrollbars . They're easy to overlook while developing (especially on macs) and if users scrolls horizontally, your layout…
Polypane 6.3: Tunnel vision simulator, webmanifest support, updated UI
In Polypane 6.3 we added new debug tools and improved the meta panel and outline panel. And we moved the reload button. What's Polypane? Polypane is a web browser for developers, designers and anyone that works on web…
Detecting media query support in CSS and JavaScript
Recently I needed a way to detect support for a media query in CSS and JavaScript. To detect if a browser supports a certain CSS feature, you can use @supports () { ... } , but that doesn't work for media queries. In…
Polypane 6.2: HTML validation, robots.txt support, RTL emulation and more
In Polypane 6.2 we focused on improving the app performance and consistency, particularly around updating, pane resizing, tab handling and dark mode. What's Polypane? Polypane is a web browser for developers, designers…
Creating websites with prefers-reduced-data
Even though more and more people get access to the internet every day, not all of them have fast gigabit connections or unlimited data. Using the media query prefers-reduced-data we can keep our sites accessible to…
Fixing contrast issues, on your own site and elsewhere
Insufficient text contrast is the most common accessibility issue on websites today. According to the WebAIM Million report for 2021 , 86.4% of home pages world wide have low contrast text. What's worse, this number has…
A11y tooling in Polypane (video)
On May 25th Kilian Valkhof (the creator of Polypane) joined the Twitch channel of Stephanie Eckles to walk through most of the accessibility options in Polypane. Check out the recording below: If you prefer reading…
Polypane 6.1: Readability, Content Chaos and rewritten event sync engine
Polypane 6.1 adds two new debug tools and a much more performant, completely rewritten interaction syncing engine along with numerous smaller improvements and bug fixes. What's Polypane? Polypane is a web browser for…