Nutshell is a tool to make "expandable, embeddable explanations", like this! They can even be recursive. Nutshell doesn't require writing in a new format – just good ol' headings, paragraphs, and links. This way, you don't have to write all your expandable explanations from scratch: you can just build upon others', and others can build upon yours.
Nutshell lets you include only the snippet you need, not the whole page. And instead of a jungle of new tabs your reader stays on one page, keeping their flow of reading. Even if you interrupt a sentence, Nutshell recaps the sentence afterwards, so your reader never loses context. You can also embed interactive playthings, YouTube videos, and – hey, why not – Wikipedia articles. (That includes other languages and Simple Wikipedia, too!)
To embed a snippet, just make a link, but with a :colon in the front so that Nutshell knows to make it expandable.
Fairly lightweight, it's feasible to just download nutshell.js and add it to your website's theme.
ozo is a tiny (<5kB) drop-in stress-free solution for web components. Skip NPM - with a single <script>, it lets you write beautiful code, and ship it, too.
Yozo's latest release comes in at 4699 bytes gzipped, and it will always remain less than 5kB to keep sites snappy and responsive. Built on top of native web components, Yozo works everywhere and plays nice with other tools. Write your components once, and use them in any project. Because complex build tools and configuration hell are a nighmare, Yozo was made to be the solution that Just Works. Include it with a script tag, and start using it right away.
Block AIs from reading your text with invisible Unicode characters while preserving meaning for humans. Blows up a readable character count of 112 to many thousands (101843) with a little manipulation of the slider. This tool inserts invisible zero-width Unicode characters between each character of your input text. The text will look the same but will be much longer and can help stop AI plagiarism. It also helps to waste tokens, causing users to run into rate limits faster. Even just one word's worth of gibberified text is enough to block most LLMs from responding coherently.
Lucide is an open-source icon library that provides 1000+ vector (svg) files for displaying icons and symbols in digital and non-digital projects. The library aims to make it easier for designers and developers to incorporate icons into their projects by providing several official packages to make it easier to use these icons in your project.
Icons are lightweight, highly optimized scalable vector graphics (SVG). Designed with a strict set of design rules for consistency in style and readability. Customize the color, size, stroke width, and more. Lucide is available as a package for all major package managers. The icons are tree shakable, so you only import the icons you use.
Monospace fonts are dear to many of us. Some find them more readable, consistent, and beautiful, than their proportional alternatives. Maybe we’re just brainwashed from spending years in terminals? Or are we hopelessly nostalgic? I’m not sure. But I like them, and that’s why I started experimenting with all-monospace Web.
Creates one or more LeafletJS map layers from an unlimited number of geospatial raster and vector data files, transparently fetching/drawing data as you interact with the map. Driven by a highly configurable user defined JSON file. Requires only geospatial data files and web browser. No intermediate servers/services, no back-end servers are needed.
Data sets of unlimited raster/vector data sources (files) can be defined and added to layers. Data sources (files) can live in the cloud (S3) or a web server, as can your JSON config, too! Define your own pixel scaling function for unit conversion, normalization, etc. Filter scaled pixel values in a range. Vector data are not tiles! Style your vector features (geometry) using CSS. Vector data are not tiles! Execute code on events for any feature (geometry). Pre-defined palettes for styling your raster pixels. Define your own palette function to style your pixels just so. Clip a raster layer with a feature from a vector layer. Add pop-ups, tool-tips, markers to your point, polygon, linestring vector data like any Leaflet map.
The magic is in the file formats and HTTP server. For raster data the format is Cloud Optimized GeoTiff (COG). For vector data the format is Flatgeobuf (FGB). Both of these formats can be read using a feature of an HTTP server called range requests. This allows a web client to request a range of bytes within a file without reading the whole file. This is exactly the method streaming uses, like watching a YouTube video.
Further, both COG and FGB are spatially indexed allowing you to grab a range of bytes using a bounding box. COG has overviews built in and the appropriate overview(s) are returned depending on the bounding box. The same approach for FGB, if that geometry intersects the requested bounding box that geometry is retrieved. This SDK relies heavily on work by Daniel DuFour (georaster-for-leaflet) and Bjorn Harrtell (flatgeobuf-geojson).
A collection of classless CSS themes, each displayed on a page with common HTML elements.
Lissa Explains it All is a colorful and fun approach to learning HTML for Kids and the young at heart. With this tutorial, kids and beginners learn step by step how to make their own Web page and publish it on the WWW. For the more advanced, .htaccess files, installing perl scripts and much more is covered.
After you've completed your Web site, you'll need tools to make it more interactive for your visitors. You can find all the latest gadgets here for your Web site including forums, guestbooks, polls, e-mail forms, tagboards, blogs, users online counters and even a handy online HTML editor to convert your ideas into HTML code. We have a small, but growing collection of cgi scripts including a guestbook, users online script, and a plugboard that requires no MySql database. Also, we have free downloadable programs, including Icon Art, with which you can make your own cursors and favicons! Need to play music on your Web site? We have a nifty MP3 player that is easy to install and use.
Bootstrap/386 is a Bootstrap v2/3/4/5(in progress) theme to make webpages look like they are from the gentler, less distracting time of the 1980s. Does a great job of making a website look like an MS-DOS application running on a somewhat slow PC. Resembles the Borland Turbo UI in many ways. The Javascript even looks fairly configurable.
The world's #1 open source rich text editor.
Using an old version of TinyMCE? We recommend you to upgrade to TinyMCE 7 to continue receiving security updates, or consider TinyMCE 5 LTS if you need more time to upgrade.
Used and trusted by millions of developers, TinyMCE is the world’s most customizable, scalable, and flexible rich text editor. We’ve helped launch the likes of Atlassian, Medium, Evernote (and lots more that we can’t tell you), by empowering them to create exceptional content and experiences for their users.
DOOM (using libSDL) compiled into Webasm so it can be loaded as a (rather complex, really) widget. Built using Emscripten.
Requires a copy of doom1.wad copied into the sdldoom-1.10/ directory.
You can get doom1.wad here: https://doomwiki.org/wiki/DOOM1.WAD
A Barcode Detection API polyfill that uses ZXing-C++ WebAssembly under the hood.
Supported barcode formats: aztec, code_128, code_39, code_93, codabar, databar, databar_expanded, databar_limited, data_matrix, dx_film_edge, ean_13, ean_8, itf, maxi_code (only generated ones, and no position info), micro_qr_code, pdf417, qr_code, rm_qr_code, upc_a, upc_e, linear_codes and matrix_codes (for convenience).
It's probably easier just to grab it from the JS CDN and store it locally.
A high-quality selection of free icons. Your new alternative to Noun Project, Flaticon, and all Figma resources. Available in SVG, Font, React, React Native, Flutter, Figma and Framer.
A web component for peaks.js that implements the actual "give me a player for this file" widget. Generate a .dat file for the MP3 with the audiowaveform utility and it gives you a little playback widget. Also supports playlists as JSON documents.
A typeface of people silhouettes, to make it easy to build web graphics featuring little people instead of dots. Just add the contents of "weepeople.css" to your page, or link to that CSS file.
The repo has the CSS file, the glyphs, a Truetype font file, and v1 and 2 webfont files.
Bulma is a free, open source framework that provides ready-to-use frontend components that you can easily combine to build responsive web interfaces. No knowledge of CSS required. Designed with mobile first in mind. Aims to be easy to customize with Sass variables. Automatic light/dark mode supported. Tries to have the simplest grid system possible. Automatically resizing columns.
No Javascript required or included. If you want to use it, that's on you.
Github: https://github.com/jgthms/bulma
(Description by Simon Willison, which is more clear than the one on the site itself.)
Blake Watson's brand new HTML tutorial, presented as a free online book. This seems very modern and well thought-out to me. It focuses exclusively on HTML, skipping JavaScript entirely and teaching with Simple.css to avoid needing to dig into CSS while still producing sites that are pleasing to look at. It even touches on Web Components (described as Custom HTML tags) towards the end.
Github: https://github.com/blakewatson/htmlforpeople
License: BY-NC-SA 4.0
Silverstripe CMS is the intuitive content management system and flexible framework loved by editors and developers alike. Tries to be easy to use. Aims for stability, security, and excellent support. Tries to generate highly reusable code with a built-in templating engine.
Installs with Composer.
Github: https://github.com/silverstripe
Provides a suite of tools to help people overcome reading struggles caused by dyslexia.
Turns the font on all pages into Open Dyslexic on every page AND allows for a wide array of super useful font manipulation tools to help ease the pain of reading online. The font is designed to ease the pains of reading with dyslexia by combatting commonly occurring symptoms. For more information visit opendyslexic.org.
The reading feature lets you tag along while your browser reads to you! If you have a hard time tracking, and loose your place (like I so often do) this feature is designed for you. Just highlight what you want read, click "Read Selected" in the right click menu, and it will read the highlighted text in the voice of your choosing!!