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.
Overview of the RenderingNG architecture - Chrome Developers
An Overview of the RenderingNG Architecture — Just how does Chrome render pixels on your screen?...
Snowflake Generator
Snowflake Generator: Generate a Random or Custom Snowflake Image — One of those things that’s just fun...
GitHub - salvia-kit/salvia-kit-website: Salvia-kit provides beautiful dashboard templates built with Tailwind CSS for React, Next.js, Vue and Nuxt.js
Salvia-Kit: Beautiful Dashboards Built with Tailwind CSS — Currently includes eight dashboards with each one including...
Color Tools And Resources — Smashing Magazine
Color Tools and Resources — The team at Smashing Magazine has put together this collection of...
Display sophisticated text via Markdown in Retool's Text component
How We Built Markdown Support into Our Low-Code App Builder
Building a breadcrumbs component
Building a Breadcrumbs Component — A foundational overview of how to build a responsive and accessible...
For developers, Apple’s Safari is crap and outdated
'For Developers, Apple’s Safari is C**p and Outdated' — This spirited piece claims that with “IE...
Improving the Tesco Loan Calculator - Chris Annetts
Improving A Calculator Form — A web form designer tries to improve a web-based calculator. Goes...
How To Create Angular Toast, Snackbar or Notification
How to Create Rich Angular Snackbar Notifications — In this fun and easy-to-follow video, learn how...
Thinking About The Cut-Out Effect: CSS or SVG? - Ahmad Shadeed
Thinking About the Cut-Out Effect: CSS or SVG? — A real deep-dive look at just how...
NFC comes to the web - SAP Customer Experience Labs
NFC Comes to the Web — NFC functionality is now widely available on the hardware side,...
How do Chrome extensions impact browser performance?
How Do Chrome Extensions Impact Browser Performance? — This report investigates how 1,000 of the most...
Software Engineering Bootcamp: Best Courses to Learn Software Engineering
Get a Software Engineering Job, Guaranteed — With a curriculum built by Colt Steele and 1:1...
Reflections as the Internet Archive turns 25 - Internet Archive Blogs
Reflections as the Internet Archive Turns 25 — The Internet Archive has been taking digital snapshots...
Free Online CSS, HTML and JS Tools And Resources
Toolb: 50+ Free Web Tools for Your Daily Workflow — This has just about everything! A...
A Bashful Button Worth $8 Million
A Bashful Button Worth $8 Million — Ah, the old 100vh bug strikes again. This is...
Detecting media query support in CSS and JavaScript | Kilian Valkhof
Detecting Media Query Support in CSS and JavaScript — To detect if a browser supports a...
Of Course We Can Make a CSS-Only Clock That Tells the Current Time!
Of Course We Can Make a CSS-Only Clock That Tells the Current Time — A fun...
From A Colourblind Designer To The World: Please Stop Using Red And Green Together • Baseline • The Free Design Bootcamp
From A Colourblind Designer To The World: Please Stop Using Red And Green Together — Deuteranopia...
Dark Mode Web App Manifest App Icons
Dark Mode Web App Manifest App Icons — Yep, you can have SVG app icons that...
CSS { In Real Life } | Inspecting Sizes
Inspecting Sizes — Dev tools can easily toggle between RGB, HSL, and hex values — but...
React authentication, simplified | Userfront guide
React Authentication, Simplified — In this article, we lay out a new approach to authentication (plus...
Maintaining End-To-End Quality With Visual Testing — Smashing Magazine
Maintaining End-To-End Quality With Visual Testing — A detailed look at how visual testing can prove...
Can Opera finally sing on Google's Chromebooks and Windows 11?
Can Opera Finally Sing On Google's Chromebooks and Windows 11? — A chat with the Opera...
The accessibility stalemate | Christian Heilmann
The Accessibility Stalemate — On how well meaning, and often excellent accessibility advice, doesn’t reach the...
It’s A (Front-End Testing) Trap! Six Common Testing Pitfalls And How To Solve Them — Smashing Magazine
It’s A (Front-End Testing) Trap! Six Common Testing Pitfalls And How To Solve Them
Unicode Arrows
Unicode Arrows — Yes, it’s a neat collection of all the → unicode arrows ← you...
React Native SDK for Chat Messaging
Free Chat/Messaging UI Kits for Your Website or App
Counter styles converter
Counter Styles Converter — This online tool lets you see what is produced for a given...
GitHub - nativefier/nativefier: Make any web page a desktop application
Nativefier: Make Any Web Page A Desktop Application — A basic Node.js-powered tool for creating a...
GitHub - actuallyakash/spacers: 🔳 when you need more __space__
spacers: A JS Library to Control Spacing Around Elements — This is loosely based on the...
The Future Of The Web
The Future Of The Web — I enjoyed this high-level overview musing on what the web...
The performance effects of too much lazy-loading
The Performance Effects of Too Much Lazy-loading — Too much of a good thing? Here’s some...
http://thld.co/2244720210721
What If Your Project Management Tool Was Fast and Intuitive? — Imagine how much more you...
3D Bay - Free 3d Stock images by CloudDevs
3D Bay: 3D Stock Images, Free for Commercial Use and Filterable by Category
Towards richer colors on the Web
Towards Richer Colors on the Web — A detailed piece covering the efforts to add richer...
Refactoring CSS: Introduction (Part 1) — Smashing Magazine
An Introduction to CSS Refactoring — The first in a three-part series going through the CSS...
Getting lively with Firefox 90 – Mozilla Hacks - the Web developer blog
Getting Lively: Firefox 90 Released — Plenty of JavaScript additions in this release, including private fields...
Introducing Browser Logger - Unlocking the Power of Frontend Logs ⬢ LogDNA
Unlock the Power of Your Frontend Logs with LogDNA — Frontend developers can easily ingest browser...
The ugly, geeky war for web privacy is playing out in the W3C
The 'Ugly, Geeky War' for Web Privacy Is Playing Out in the W3C — The inside story...
vechai/vechaiui
Vechai UI: A Set of High-Quality Accessible React UI Components — Includes built-in dark mode and...
drumnickydrum/sequencer64
Sequencer64: An Experimental Music Creation Tool that Works Offline as a PWA — Try it here....
AVPress - an in-browser video compressor
AVPress: An In-Browser Video Compressor — 100% client-side and it includes a number of different settings...
Top React component libraries (2021 edition)
Get Started with the Best React Component Libraries in < 7 Minutes
Making A Strong Case For Accessibility — Smashing Magazine
Making A Strong Case For Accessibility — How to implement and advocate for accessibility from the...
The Dilemma of Naming Font Size Variables
The Dilemma of Naming Font Size Variables — Is something like $mouse and $elephant a clear...
Organize your CSS declarations alphabetically
Organize Your CSS Declarations Alphabetically — There are a few schools of thought when it comes...
Building A Dynamic Header With Intersection Observer — Smashing Magazine
Building a Dynamic Header with Intersection Observer — Ever needed to have a component respond to...
OMG, SVG Favicons FTW!
OMG, SVG Favicons FTW — Explores the fun to be had with SVG favicons. Covers adding...
Using HSL Colors In CSS — Smashing Magazine
Using HSL Colors in CSS — A handy primer that explains what HSL is, and how...