Link List

A web com­po­nent to add line num­bers next to var­i­ous HTML ele­ments — zach­leat/­line-num­bers

Test­ing ver­ti­cal met­rics typog­ra­phy across browsers.

Build blaz­ing-fast, reac­tive UIs in pure TypeScript/​JavaScript – no vir­tu­al DOM. Aberdeen offers a refresh­ing­ly sim­ple approach to reac­tive UIs.

A self-hostable per­son­al cloud inspired by server­less plat­forms and CGI-BIN. Small­web maps sub­do­mains to sub­fold­ers in your small­web direc­to­ry.

The can­vas ele­ment: part of an alpha­bet­i­cal run through every HTML ele­ment.

The can­vas ele­ment: part of an alpha­bet­i­cal run through every HTML ele­ment.

Cura­tor is a free for­ev­er social media aggre­ga­tor that helps you col­lect and dis­play con­tent. Set up your feed in under 5 min­utes.

Col­or is com­pli­cat­ed, but you can eas­i­ly learn the dif­fer­ence between a col­or mod­el, space, and gamut, and why they exist in the first place.

Cus­tom ele­ments (web com­po­nents) for mak­ing audio and video play­er con­trols that look great in your web­site or app. — mux­inc/­me­dia-chrome

Cre­ate a share­able pre­view link of your web­site that works out of the box with­out chang­ing your Hosts file. You can cre­ate a site with team mem­bers with­out hav­ing to merge the changes lat­er.

A fun CSS-only exper­i­men­ta­tion to cre­ate a jump­ing dot between radio inputs

How to add smooth tran­si­tions to lazy-loaded images with­out exter­nal libraries.

The search ele­ment rep­re­sents a doc­u­ment or appli­ca­tion con­tain­ing a set of form con­trols or oth­er con­tent relat­ed to per­form­ing a search or fil­ter­ing oper­a­tion. This could be a search of the web­site or appli­ca­tion, search­ing or fil­ter­ing search results on the cur­rent web page, or a glob­al or Inter­net-wide search func­tion.

Cre­ate har­mo­nious col­or pat­terns with Oklchro­ma, a pow­er­ful OKLCH-based col­or scale gen­er­a­tor for design­ers and devel­op­ers.

Fix CORS in DDEV devel­op­ment by adjust­ing vite.config.js.

Vig­i­lant is a tool for aggre­gat­ing appli­ca­tion logs. Use the SDK to send logs and view them in a dash­board.

Use the View Tran­si­tions API to cre­ate smooth ani­ma­tions between DOM states with min­i­mal CSS and JavaScript, replac­ing heavy ani­ma­tion libraries.

Gen­er­ate and cus­tomize CSS eas­ing func­tions with ease and mag­i­cal pre­ci­sion using Eas­ing Wiz­ard 🧙

One web page using every HTML ele­ment.

Back­ing up your data is crit­i­cal for effec­tive­ly any self-host­ed appli­ca­tion. Let’s explore how you can make it hap­pen for Plau­si­ble Ana­lyt­ics.

Ser­vices like S3 and R2 can be invalu­able when self-host­ing Plau­si­ble Ana­lyt­ics. Let’s walk through what it looks like to use them for auto­mat­ed back­ups a sim­ple cron job.

Down­load and self-host 1500 open-source fonts in neat­ly bun­dled NPM pack­ages. Access a com­pre­hen­sive library of web type­faces for free.

Free, open-source load­ing ani­ma­tions. Avail­able as copy/​paste HTML or drop-in web com­po­nents. Com­pat­i­ble with every mod­ern frame­work.

HTTP Secu­ri­ty Head­ers are essen­tial to any web­site. Learn about the HSTS head­er, Con­tent Secu­ri­ty Pol­i­cy head­er CSP, XSS pro­tec­tion, cache con­trol, strict trans­port secu­ri­ty, set-cook­ie head­er, and many more http head­ers in this com­pre­hen­sive guide with exam­ples and take your web­site secu­ri­ty head­er game to the next lev­el with Dark­re­lay.

This devel­op­er built their resume web­site using HTML, CSS, and Eleven­ty.

HTML Forms have pow­er­ful val­i­da­tion mech­a­nisms, but they are heav­i­ly under­used. In fact, not many peo­ple even know much about them. Is this because of some flaw in their design? Let’s explore.

Com­mand line tool for ​“Can I Use …” and MDN Brows­er Com­pat Data.

Unsec­tion is a web­site that offers inspi­ra­tion for var­i­ous web­site sec­tions. It is a good resource for find­ing the best web­site sec­tion for your web­site.

An exper­i­ment in javascript-free syn­tax high­light­ing, made pos­si­ble by open­type con­tex­tu­al alter­nates and COLR table

Tips for Keep­ing All Fron­tend Appli­ca­tions Secure