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.
Announcing Speedometer 3.0: A Shared Browser Benchmark for Web Application Responsiveness
Announcing Speedometer 3.0: A Shared Browser Benchmark for Web Application Responsiveness — Speedometer has been around...
GitHub - antonmedv/finder: CSS Selector Generator 🗺
Finder 3.2: CSS Selector Generator — Given an element, it produces the shortest possible selector that...
Expressive Code
Expressive Code: An Engine for Presenting Source Code on the Web — Sort of like a...
This is WCAG
This is WCAG: A Free Resource to Help You Build Inclusive Web Experiences — Includes 80+...
Capo.js: A five minute web performance boost
Capo.js: A Five Minute Web Performance Boost? — Dave quips that this tool can offer a...
A Practical Guide To Designing For Colorblind People — Smashing Magazine
A Practical Guide To Designing for Colorblind People — Some practical accessibility guidelines and resources to...
Jakob Has Jumped the Shark
'Jakob Has Jumped the Shark'? — It’s fair to say Jakob Nielsen’s latest rumination on generative...
Improvements to the Speculation Rules API | Blog | Chrome for Developers
Improvements to the Speculation Rules API — A look over the latest updates to the experimental...
FOSDEM 2024 - The importance of Web Performance to Information Equity
▶ The Importance of Web Performance to Information Equity — A 20-minute talk on the vital role...
Best Practices for OAuth in Mobile Apps
Best Practices For OAuth In Mobile Apps — Master the art of secure logins: Where OAuth...
Proposal: CSS Variable Groups • Lea Verou
CSS Variable Groups — A proposed way to define multiple properties under the same namespace and...
lamplightdev - Streaming HTML out of order without JavaScript
Streaming HTML Out of Order Without JavaScript — An interesting, yet short and sweet, demo of...
Creating color palettes with the CSS color-mix() function | MDN Blog
Creating Color Palettes with the CSS color-mix() Function — This article serves as a thorough explainer...
The quiet, pervasive devaluation of frontend
The Quiet, Pervasive Devaluation of Frontend — Considered introspection here on the discernment of the frontend...
Interaction to Next Paint is officially a Core Web Vital 🚀 | Blog | web.dev
Interaction to Next Paint is Now Officially a Core Web Vital — It has now replaced...
Video API | ImageKit.io
Handling Videos? Here's the Only Video API You'll Ever Need — Transform videos in real-time with...
Cookie consent
Brainsum's Cookie Consent Bar — Few people love them, but cookie consent messages are required in...
PixiJS v8 Launches! 🎉 | PixiJS
PixiJS v8: Build Striking 2D WebGL Experiences — PixiJS is a very mature, long standing rendering...
Apple reverses course on death of Progressive Web Apps in EU
Apple Reverses Course on 'Death' of Progressive Web Apps in EU — For the past couple...
UI Builder & Prototyping Tool For Developers | UXPin Merge
🧩 Build Your Products 8.6x Faster. Put FrontEnd on Autopilot — Customize and theme React templates...
WebKit Features in Safari 17.4
WebKit Features in Safari 17.4 — Just like Safari 15.4 and 16.4, Safari 17.4 is a...
An HTML Switch Control
Safari Switching It Up with.. an HTML Switch Control — “We’re very excited to introduce a...
Modern CSS Tooltips And Speech Bubbles (Part 1) — Smashing Magazine
Modern CSS Tooltips and Speech Bubbles — Everyone knows what tooltips are, but despite their ubiquity,...
Playing with Infinity in CSS
Playing with Infinity in CSS — Did you know CSS has an infinity constant that can...
“AI” and accessible front-end components: is the nuance generatable?
'AI' and Accessible Frontend Components: Is the Nuance Generatable? — Are LLMs helpful tools to assist...
Reporting Core Web Vitals With The Performance API — Smashing Magazine
Reporting Core Web Vitals with the Performance API — The Performance API provides an interface to...
Bugs I’ve filed on browsers
Bugs I’ve Filed on Browsers — “I think filing bugs on browsers is one of the...
JavaScript Bloat in 2024
JavaScript Bloat in 2024 — What’s the average size of JavaScript code downloaded per website? Spoiler...
NSFW JS
NSFW JS 4.0: Client-Side Indecent Content Checking — The last thing most folks want uploaded to...
Simple Icons
Simple Icons: 3000+ Free SVG Icons for Popular Brands — This project that we link to...
Tailwind Skeleton Generator
🩻 Skeleton Generator: Generate Tailwind-Based 'Loading Skeletons' for HTML Content — An online generator that will take...
flag-icons: Free Country Flags in SVG
🏳 All Country Flags in SVG (Plus CSS for Easier Integration)
Lift-off: The MDN Curriculum launch | MDN Blog
Lift-Off: The MDN Curriculum Launch — The MDN Curriculum is a new resource on the excellent...
CSS :has() Interactive Guide
An Interactive Guide to CSS :has() — A superb, extensive guide to everything that you practically...
Pico CSS • Minimal CSS Framework for semantic HTML
Pico.css: A Minimal CSS Framework for Semantic HTML — The focus is more on styling native...
GitHub - clhenrick/color-legend-element: A custom element (web component) suitable for use as a legend in data visualizations
Color Legend Element: A Web Component Providing a Legend in Data Visualizations — Built with Lit/Lit-Element...
Shoelace: A forward-thinking library of web components.
Shoelace: 'A Forward-Thinking Library of Web Components' — We’ve featured this collection of well designed UI...
Userfront | Auth Without Complexity
Transformational Auth & Identity | Userfront — Userfront is an auth & identity platform that transforms...
WebPerf Snippets – Nextra
WebPerf Snippets — A curated list of snippets to get Web Performance metrics to use in...
Mojo CSS · The Atomic CSS Framework for crafting gorgeous UIs without shipping any CSS.
Mojo CSS: An Atomic CSS Framework with Near-Zero Runtime — Another player in the atomic CSS...
Functional UI Kit
Functional UI Kit: A Unified Figma and React UI Component Kit — It hasn’t felt like...
The Linear Look | Frontend Horse | Creative Web Development
The Linear Look — An overview of a particularly dominant web design trend in the SaaS/tech space.
Designing With Integrity: The Ethical Designer's Handbook On Dark Patterns - Raw.Studio
Designing with Integrity: The Ethical Designer's Handbook on Dark Patterns — A detailed look at the...
Going beyond pixels and (r)ems in CSS - Container query length units - iO tech_hub
Going Beyond Pixels and (r)ems in CSS: Container Query Length Units — A look at container query...
The Self-Rendering Eval Shirt
How StackBlitz Built a T-Shirt That Renders Itself — How we designed a t-shirt using valid...
Mobile Accessibility Barriers For Assistive Technology Users — Smashing Magazine
Mobile Accessibility Barriers for Assistive Technology Users — A collection of lessons learned from assistive technology...
View transitions: Handling aspect ratio changes
View Transitions: Handling Aspect Ratio Changes — If your view transition animations don’t look quite right,...
Home Screen Advantage - Infrequently Noted
Home Screen Advantage — Alex shares that Apple’s efforts to “maintain its home screen advantage” with...
Open Letter to Tim Cook: Sabotaging Web Apps Is Indefensible
Open Letter to Tim Cook: Sabotaging Web Apps is Indefensible — This seeks to halt upcoming...
Next-gen Web Extension Framework – WXT
WXT: Next-Gen Web Extension Framework — A framework for creating cross-browser extensions. You can target Chrome,...