Free Browser Utilities — 10 Private Tools
Converters, formatters and debuggers that never upload your files.
webdev
443: Image Hosting is Quite Powerful on CodePen
We’ve made several upgrades to uploading/hosting images on CodePen lately. One change, moving to the open-source file-uploading library Uppy, was driven by business concerns. But the benefits…
GraphViz Examples and Tutorial
An interface as well as documentation to the GraphViz program and DSL
The unreasonable effectiveness of HTML — examples
animation-trigger | CSS-Tricks
The CSS animation-trigger property allows you to delay the start of a CSS animation until a specific trigger occurs.
Home 🍹 HTMLcat
HTML Can Do That
HTML has been gobbling up swathes of what used to be JavaScript’s remit. This page lists a bunch of dynamic functionality that we can now achieve with just HTML.
5 CSS Properties You Should Know for Better Text Designs
Includes background-clip for masking backgrounds, vertical-align for aligning elements, box-decoration-mode for consistent edge styling, letter-spacing for spacing control, and text-combine-upright for vertical text layouts.
3 constraints before I build anything | Jordan Lord
['Programmer', 'Computer nerd', 'Unix enthusiast'];
How Aspect Ratios Define Perception, Rhythm, and Flow
A deep exploration of how aspect ratios shape perception, visual rhythm, and usability in modern interfaces. From grids to galleries to video players, this article dissects how proportion silently governs how users see, feel, and interact with content.
Migrating from DigitalOcean to Hetzner: From $1,432 to $233/month With Zero Downtime
A real-world production migration from DigitalOcean to Hetzner dedicated, handling 248 GB of MySQL data across 30 databases, 34 Nginx sites, GitLab EE, Neo4j, and live mobile app traffic — with zero downtime.
The End of Eleventy
Build Awesome is a rebrand of 11ty/Eleventy, backed by a successful $40k Kickstarter. But this attempt to monetize static site generators repeats the same mistakes that killed Gatsby and Stackbit—and misunderstands who actually builds static sites.
Scaling a Monolith to 1M LOC: 113 Pragmatic Lessons from Tech Lead to CTO
For context, I work in a Django/React TS/React Native codebase on a 20-person team at MorphMarkethttps://www.morphmarket.com/. I have 17 years experience wit...
Beyond border-radius: What The CSS corner-shape Property Unlocks For Everyday UI — Smashing Magazine
For years, developers have been hacking around the limitations of `border-radius`, using clip-path, SVG masks, and fragile workarounds just to get anything other than round corners. The new `corner-shape` property finally changes that, opening the door to beveled, scooped, and…
The Value of z-index | CSS-Tricks
How we look at the stacking order of our projects, how we choose z-index values, and more importantly, the implications of those choices.
The Illustrated TLS 1.2 Connection
Every byte of a TLS connection explained and reproduced
Getting Started With The Popover API
What happens if you rebuild a single tooltip using the browser’s native model without the aid of a library? The Popover API turns tooltips from something you simulate into something the browser actually understands. Opening and closing, keyboard interaction, Escape handling, and…
DNS Explained - How Domain Names Get Resolved
Learn how DNS works: hierarchy, records (A, CNAME, MX, TXT), TTL caching, and the full resolution process. Plus commands to view and clear DNS cache.
The dangers of SSL certificates
Yesterday, the Bazel team at Google did not have a very Merry Boxing Day. An SSL certificate expired for and as shown in this screenshot from the github issue. This expired certificate apparently b…
Introducing CSS Grid Lanes
It’s here, the future of masonry layouts in CSS!
How To Measure The Impact Of Features — Smashing Magazine
Meet TARS — a simple, repeatable, and meaningful UX metric designed specifically to track the performance of product features. Upcoming part of the Measure UX & Design Impact (use the code 🎟 IMPACT to save 20% off today).
Masonry: Things You Won’t Need A Library For Anymore
CSS Masonry is almost here! Patrick Brosset takes a deep dive into what this long-awaited feature means for web developers and how you could make use of it in your own work.
Linking to text fragments with a bookmarklet
I've written a bookmarklet that helps me link to specific text on a web page.
You no longer need JavaScript
An overview of what makes modern CSS so awesome.
An Illustrated Guide to OAuth
OAuth was first introduced in 2007.
Plain Vanilla
An explainer for doing web development using only vanilla techniques.
Tools and resources our designers are using right now
A list of what tools and resources are most relevant for our designers right now.
Fuma Nama | Some Nice Things with SVG
Exploring SVG and its visual effects applications
white
Apache ECharts
Apache ECharts, a powerful, interactive charting and visualization library for browser
Everything you need to start blogging as a developer!
Hashnode is a free developer blogging platform that allows you to publish articles on your own domain and helps you stay connected with a global developer community.
Frontend Masters Guides | Frontend Masters
Frontend Masters Guides Description
webgpufundamentals.org
Learn webgpu
Creating CSS masonry-style layouts
Written by Nwani Victory✏️ When designing a page with content overflowing the viewport, an indirect...
Mastering CSS Flexbox: From Basics to Advanced Techniques
Introduction Are you tired of using tables, floats, and other traditional CSS layout...
Putting Gears In Motion: Animating Cars With HTML And SVG
SVG `` provides a way to define how an element moves along a motion path. In this article, Paul Scanlon shares an idea of how to use it by animating race cars in an infinite loop as easy as one-two-three!
Easy SVG Customization And Animation: A Practical Guide
Developers often feel discouraged from editing SVG markup and experimenting with SVG animations, thinking it’s a significant time investment or they need to use a complex animation library to do so. In this article, Adrian showcases his favorite tricks, which make the process…
SVG — Smashing Magazine
Smashing Magazine — front-end, UX and design for front-end engineers and designers
76 CSS Cards
Welcome to our collection of CSS cards! In this comprehensive compilation, we have gathered a wide range of free HTML and CSS card code examples from various reputable sources, including CodePen, GitHub, and other valuable resources.
Relearn CSS layout
Web Design & Development Toolkit
Discover hundreds of web design & development resources in this carefully curated collection.
Npm vs Yarn: What Should you use for managing packages in React?
Both npm (Node Package Manager) and Yarn are popular package managers for JavaScript projects,...
How To Build A Magazine Layout With CSS Grid Areas
Web development, especially what you can do with CSS, has become increasingly complex. With the added capabilities of CSS Grid, it is now possible to achieve layouts that look like they were laid out by hand. Let’s tackle a practical example of how to do something like that.
Native CSS masonry layout | pawelgrzybek.com
A masonry type of layout, one of the biggest obsessions of UX designers, is finally coming to CSS. Style popularized by Pinterest, where elements fill the vertical gaps instead of being aligned to the row axis.
Visual design rules you can safely follow every time
Sticky Notes with CSS3
What is a sticky notes with css3, How do you make a sticky notes with css3? Sticky Notes with CSS3...
Using Curl to make REST API requests | Linuxize
In this article, we're going to discuss how to use Curl to interact with RESTful APIs. Curl is a command-line utility for transferring data from or to a remote server.
Google Arts & Culture
Google Arts & Culture features content from over 2000 leading museums and archives who have partnered with the Google Cultural Institute to bring the world's treasures online.
5 Node.js Tools to Learn in 2023
Check out 5 Node.js tools that can help boost your productivity in 2023.
7 Open-Source Log Management Tools that you may consider in 2023
Effective log management is a fundamental aspect of maintaining and troubleshooting today's complex...
CSS Named Colors: Groups, Palettes, Facts, & Fun
Note: Due to publishing limitations, the groups of colors in this post are inserted as images. For...