MCPs and AI Agents
Model Context Protocols (MCPs) are an interesting adjacent technology to large language models (LLMs) and AI agents. They provide a standardized way for AI models to interact with external data...
Create A Translation Custom Element
I've always struggled with how to integrate AI into web applications. It wasn't until I learned about Transformers.js and the Chrome native AI APIs that I realized how powerful these tools could...
Building a Text-To-Speech Custom Element
When I first conceived the idea of creating a custom element for text to speech (TTS), I envisioned a simple web component that could leverage existing web technologies and AI, packaged as a web...
Can we unSASS yet?
While modern CSS has adopted several powerful features that were once exclusive to preprocessors like SASS, a number of key SASS functionalities are still not natively available. For some of these,...
The WebCodecs API
The WebCodecs API gives web developers unprecedented, low-level access to the browser's built-in media codecs (the encoders and decoders that process video and audio). This unlocks a wide range of...
CSS - what we are missing
CSS has come a long way since its inception, evolving from a simple styling language to a powerful tool for creating complex layouts and animations. I love playing with CSS and exploring its...
Creating a Font Inspector
When working with custom fonts, especially variable fonts, it can be tedious to manually extract font metrics and generate the necessary CSS @font-face rules. A script that automates this process can...
A Deep Dive into Modern Fonts
In modern web design, we treat fonts as a cornerstone of user experience. They convey brand identity, improve readability, and define a site's aesthetic. However, the methods we use to load these...
New CSS Property - interpolate-size
The interpolate-size property has been added to CSS to enable smooth animations when transitioning an element's size to or from intrinsic sizing keywords like auto. This post will cover what...
Generating Random Values in CSS
Until now generating random values to use in CSS required Javascript to generate the random values and apply them to CSS rules. The CSS Working Group has created two different ways to generate and use...