Color Contrast in CSS
The CSS Color Level 5 specification defines a way to provide contrast between background and foreground colors. The color-contrast() function takes the followng arguments: A color for the...
Lightening and darkening colors with CSS
CSS is adopting a lot of new features that in the past were only available in pre-processors or via Javascript. One of those features is the ability to lighten and darken colors like SASS darken() and...
File Handling Access API
In The File System Access API: simplifying access to local files, the authors describe how to use the API to create file management functionality for web applications The idea is that we'll be able to...
Editor As A PWA
In 2021 I thought of building a text editor based on Monaco and built as an Electron application was a good idea. Rather than wrap Electron around the app, I will try to build an editor again but make...
Building a PostCSS workflow (part 2)
In the last post, we built a basic PostCSS workflow using Gulp. This post will cover additional features that are nice to have in a workflow but are not required to run it. We will also look in some...
Building a PostCSS workflow
For a while, SASS was all we needed. I was OK with it only being available as a Ruby Gem (the original implementation was written in Ruby), then I was happy when LibSASS came around (written in C) and...
Plans for this blog in 2022
Rather than write about whatever catches my eye, I want to be a little more disciplined about what I write. These are some of the things I plan to do. If there's something that particularly catches my...
Resizing with CSS
There are times when it would be really nice if we could resize a piece of content on a page without having to use Javascript. That's where the resize property comes in handy. Using the property in an...
Container Queries and new CSS to go along with them
The CSS Containment Module Level 3 has a formal definition of containers, container queries, and container relative length units. This post contains both parts that are supported in Chromium browsers...
Font synthesis in CSS
There are times when browsers are too helpful. When there is no font to render bold, italic or small-caps text the browser will or synthesize the styles with unpredictable results but, likely, not...