👋 Hello! Just a quick programming note — I'm taking a short summer break next week, so there will be no newsletter landing in your inbox next Wednesday. Usual service resumes on August 28th — see you then. |
|
|
Relative Color Syntax — Some Basic Use Cases — We now have broad support for the relative color syntax. Chris Coyier takes a look a this “extremely powerful way to manipulate colors in CSS” in relation to colors you're already using. Chris Coyier |
The Puppeteer Browser Control Library Announces Official Firefox Support — As of version 23, the Puppeteer browser automation library now has first-class support for Firefox. Mozilla Hacks |
WorkOS: Start Selling to Enterprises with Just a Few Lines of Code — WorkOS is a modern identity platform for B2B SaaS, offering flexible and easy-to-use APIs to integrate SSO, SCIM, and RBAC in minutes instead of months. It's trusted by hundreds of high-growth startups such as Perplexity, Vercel, Drata, and Webflow. WorkOS sponsor |
How Google Handles JavaScript In Its Indexing Process — At one point if you wanted Google to index your content it needed to be directly in the HTML and not dynamically rendered with JavaScript. Things have since changed of course , but how much? Zecchini, Moore, Siddle, Ubl (Vercel) |
▶  Start Over-Engineering Your CSS — An interesting talk from the recent CSS Day conference about purposely going “over the top and embracing complexity” as a way to deepen our understanding of CSS. Kevin Powell |
|
đź“™ Tutorials, Articles & Opinion |
▶  Japanese Web Design: Weird, But It Works. Here's Why — “beneath the overwhelming user interface lies undeniable psychology”. Phoebe Yu |
HTML Web Components Can Have a Little Shadow DOM, As A Treat — Scott notes that some of the current discourse around Web Components “tends to conflate a couple of things”, chiefly around augmenting HTML via custom elements and how the Shadow DOM comes into play. Scott Jehl |
Create Interactive Tutorials in the Browser — TutorialKit enables you to create interactive tutorials instantly without building or managing any backend infrastructure. StackBlitz sponsor |
Sebastian Laube |
The Anchor Element — An informative look at the humble HTML < Heydon Pickering |
The Dying Web — A plea to us all to give Firefox a try, because open standards and privacy are “more important than a few milliseconds of loading time”. Matthias Endler opinion |
How to Create an Auto “Text Typing Effect” with Vanilla JavaScript
|
🔧 Code, Tools & Resources |
typlr.app: Create Fonts in the Browser — If you’ve never attempted to make your own font, this might be a cool place to start! This interactive tool allows you to customize each letter’s shape and kerning, and you can install it as a PWA. Evgeny Agasyants |
ObsoHTML: Node and CLI Tool to Find Obsolete HTML — ObsoHTML is a Node.js script designed to scan HTML, PHP, JavaScript, and TypeScript files within a specified directory for obsolete or proprietary HTML attributes and elements. Should help keep things tidy. Jens Oliver Meiert |
There Are Better Things to Code Than Forms — With the SurveyJS drag-and-drop form builder, you can generate and style dynamic, JSON-driven forms right in your JS app (Angular / React / Vue.js / jQuery). SurveyJS sponsor |
tailwindcss-highlights: A Tailwind Plugin to Add Highlights to Text — The term “highlights” here refers to an effect similar to a highlighter pen for marking up an actual paper document. Includes 20 variants of the effect, which you can see here. Julian |
▶  Inter 4.0: A Big Font Update for UI Design — Now with true italics, optical sizing changes, and stylistic alternatives. However, this version 4.0 update doesn’t appear to be on Google Fonts yet. Oliver Schöndorfer |
Slab: A Programmable Markup Language That Simplifies The Creation of HTML — An alternative to tools like Pug, claiming to offer advantages like improved readability, built-in programming constructs, integration with JSON data, and an easy learning curve. Võ Minh Thu |