Frontend Focus
Feed since 17 Mar 2019This feed covers HTML, CSS, WebGL, and other associated technologies. Frontend Focus shares news, articles, tutorials and code examples for those interested in web browser technology and the web platform generally. See: http://frontendfocus.co/
To subscribe to and get updates from Frontend Focus in your feed stream, sign up, or see the rest of our feeds.
"Dark Mode" vs "Inverted"
"Dark Mode" vs "Inverted" — An approach to help clarify the difference between “dark mode” and...
Why Outdated jQuery Is Still the Dominant JavaScript Library - The New Stack
Why 'Outdated' jQuery Is Still the Dominant JavaScript Library — jQuery is one of the longest...
#26 HTMHell special: tasty buttons - HTMHell
How Not To Create a Menu Burger Button — A collection of bad practices in HTML...
Image Compressor: Compress And Optimize JPEG, PNG images Online
Image Compressor: Compress & Optimize JPEG and PNG Images — Yet another option for doing manual image...
Blobity | Level up your cursor game
Blobity: Level Up Your Cursor Game — This script and API lets you do all sorts...
Box Shadow Generator and Inspiration
Box Shadow Generator: A Visual Tool to Generate Code for CSS Box Shadows — You can...
Huetone • Make colors accessible
Huetone: Use The LCH Color Space to Come Up with Predictable and Accessible Color Palettes —...
100 Bytes of CSS to look great everywhere ∊ swyx.io
100 Bytes of CSS to Look Great Everywhere
In-Page Filtered Search With Vanilla JavaScript
In-Page Filtered Search with Vanilla JavaScript
Building an effective Image Component
Building An Effective Image Component — An out-of-the-box solution to optimize images for Next.js. It optimizes...
Building a multi-select component
Building a Multi-Select Component — A foundational overview of how to build a responsive, adaptive, and...
A Deep Dive Into object-fit And background-size In CSS — Smashing Magazine
A Deep Dive into object-fit and background‑size in CSS — Goes through just how object-fit and...
Photoshop's journey to the web
Photoshop's Journey to the Web — Just the idea of running software as complex as Photoshop...
New HTTP standards for caching on the modern web
New HTTP Standards for Caching on the Modern Web — Caching static content via a CDN...
The start of a new era for Responsive Web Design
The Start of a New Era for Responsive Web Design — After designing for fixed screens,...
New WebKit Features in Safari 15
New WebKit Features in Safari 15 — A look at the new features available with the...
Prevent Scroll Chaining With Overscroll Behavior - Ahmad Shadeed
Prevent Scroll Chaining with Overscroll Behaviour — Looks at the overscroll-behavior CSS property, what problem it...
Accessible Palette: Create color systems with consistent lightness and contrast
Accessible Palette: Online Tool to Create Color Systems with Consistent Lightness and Contrast
GitHub - KilledByAPixel/LittleJS: The Tiny JavaScript Game Engine That Can! 🚂
LittleJS: A Tiny 2D JavaScript Game Engine with Fast WebGL Rendering — No dependencies and it claims...
DOOM Rendered via Checkboxes
The Classic FPS 'DOOM' Rendered via HTML Checkboxes — Is it possible to play DOOM in...
HTML with Superpowers
▶ HTML with Superpowers — A 45-minute talk all about Web Components, covering how to use them,...
New in Chrome 95 - Chrome Developers
▶ What's New in Chrome 95 for Developers — Chrome 95 is rolling out starting today. Here,...
Functional JavaScript Learning Path – Power Up Your JavaScript with Functional Programming
Power Up Your JavaScript with Functional Programming — Learn core functional JS programming techniques by coding...
An Interview With Elad Shechter on "The New CSS Reset"
An Interview With Elad Shechter on "The New CSS Reset" — Chris Coyier chats with Elad...
Fix web accessibility systematically · Eric Eggert
Fix Web Accessibility Systematically — To address web accessibility properly, we must address the whole system...
The Art of Deception, Lighthouse Score Edition—zachleat.com
The Art of Deception, Lighthouse Score Edition — Yes, you can game your Lighthouse score, but...
Smart CSS Solutions For Common UI Challenges — Smashing Magazine
Smart CSS Solutions for Common UI Challenges — A look at some common user interface problems...
What if… you could use Visual Studio Code as the editor of in-browser Developer Tools? | Christian Heilmann
What If… You Could Use Visual Studio Code as the Editor of In-Browser Developer Tools? —...
Fiddler Everywhere Extends Web Debugging Capabilities to macOS and Linux with Kendo UI. | Kendo UI, Fiddler Everywhere Success story
Real World Use Case: Using Angular to Quickly Modernize Fiddler — Kendo UI for Angular helped...
Buttons vs. Links · Eric Eggert
Buttons vs. Links: No, They Are Not The Same — Should some links look like buttons,...
The Button Cheat Sheet
The Button Cheat Sheet — Need a button in your latest project but unsure on markup?...
CSS is Going Gosh-Darned Hog Wild, I Tell Ya What
'CSS is Going Gosh-Darned Hog Wild, I Tell Ya What' — Chris rounds up some of...
Detecting Specific Text Input with HTML and CSS - Impressive Webs
Detecting Specific Text Input with HTML and CSS — A series of HTML and CSS tricks...
How it feels to code an HTML email template in 2021 | Blog | Lune
How It Feels to Code an HTML Email Template in 2021 — It's worth noting this...
What the tag ?!
What The Tag: Quickly Find Out Which HTML Tag to Use When — A simple interactive...
Imgsrc.space - Get Image and Video placeholder right from code. Fast.
Imgsrc.space: Get Image and Video Placeholders Right From Code, Fast — This placeholder service uses a...
Wavy Divider Generator
Wavy Divider Generator: Generate Code for 'Wavy' HTML/CSS Dividers — You can pick one of the...
The Case for 'Developer Experience' - Future
The Case for 'Developer Experience' — In a world of ‘no code’, SaaS, and APIs, Jean...
Animated Backgrounds
Animated Backgrounds: A Gallery of Animated Backgrounds Built with CSS & JS — Clearly not the...
GitHub - fabiospampinato/cash: An absurdly small jQuery alternative for modern browsers.
Cash — A Tiny jQuery Alternative — This absurdly small jQuery alternative isn’t new, but Chris...
AnyWebP - Bulk WebP to JPG/PNG/ICO Online
AnyWebP: Online Tool to Bulk Convert WebP to JPG/PNG/ICO — You can convert to and from...
How to Create a CSS Typewriter Effect for your Website - SitePoint
How to Create a CSS Typewriter Effect — I think this effect can be a little...
The Autofill Dark Pattern — Smashing Magazine
The Autofill Dark Pattern — Explores how different browsers implement the autofill feature, allowing for a...
Practical frontend philosophy - jaredgorski.org
Practical Frontend Philosophy — General thoughts on how to think about frontend development: “Zoomed out, the...
My Challenge to the Web Performance Community — Philip Walton
My Challenge to the Web Performance Community — A subtle set of guidelines for how we...
Myths about Web Accessibility :: Blog :: Alvaro Montoro
Myths About Web Accessibility — A collection debunking some common web accessibility misconceptions or myths (such...
Safe DOM manipulation with the Sanitizer API
Safe DOM Manipulation (in the Future) with the Sanitizer API — The new Sanitizer API (edited...
RenderingNG: an architecture that makes and keeps Chrome fast for the long term
RenderingNG: An Architecture That Makes and Keeps Chrome Fast for The Long Term — Highlights the...
Front-End Dev Shortcuts in iOS 15
Front-End Dev Shortcuts in iOS 15 — Exploring pre-made shortcuts in the iOS Shortcuts app that...