Web Tools #565 - Chris Coyier, CSS Tools, AI, JS Utilities

Web Tools Weekly
WEB VERSION
Tools for Web Developers

Issue #565 • May 16, 2024

Advertisement

Support Web Tools Weekly via GitHub Sponsors
It's getting harder and harder to find viable advertising options for a small- to medium-sized newsletter like this one. If approximately 2,000 of my subscribers contributed $1 per month, it would be enough to keep things afloat without the need to seek out new commercial sponsors.

You can contribute to Web Tools Weekly by sponsoring me on GitHub with a one-time donation or a monthly sponsorship.

Sponsor Web Tools Weekly on GitHub

If I could fund the newsletter primarily on contributions from readers, then I wouldn't have to ever seek out advertising and I could remove advertising from the newsletter completely.

All three newsletters I produce are basically a one-man operation, so my expenses can be covered with about 10% of the audience contributing at least $1 per month.

Sponsor Web Tools Weekly on GitHub →

A short while ago I reported that CSS-Tricks was kinda-sorta back with some recent updates. There doesn't seem to be a lot of new stuff there, but some of the "new" posts are updates to older posts. Besides that, new posts still seem to be rare.

But in case you didn't know, Chris Coyier, the original CSS-Tricks founder, is still fairly active in writing about front-end technologies:

  • Chris's personal blog where he writes about and links to all sorts of things including some front-end stuff.
  • Chris's author page on the Frontend Masters blog where he's been contributing since about November, with lots of stuff in the same vein as he posted regularly on CSS-Tricks before it was sold to Digital Ocean.
  • The CodePen blog where there's more of a focus on the CodePen platform, but still lots to help those interested in learning about the latest in front-end technologies.

So if you haven't yet added those to your RSS feed, be sure to do so. And while I'm on the topic of RSS feeds, I continue to sporadically update my Frontend Feeds GitHub repository, though it does probably need a larger overhaul at the moment. Feel free to submit a PR if you want anything added.

Now on to this week's tools!
 

CSS and HTML Tools

go-masonry-gallery — A Go-based CLI program that scans a local directory for images and generates a simple HTML gallery using the experimental CSS Masonry layout.

Color Picker — An online tool that lets you upload any image and then use an eyedropper tool to "click" to generate colors for a color palette from the image.

FormSubmit — A service that provides easy form endpoints for your HTML forms so you can connect your form to our form endpoint to receive an email with the submissions, no JavaScript or backend code required.

Support This Newsletter — This newsletter is a one-man operation and finding viable sponsors is getting more difficult in the current market. You can support the newsletter with a one-time donation via PayPal.    SPONSORED 

CSS Shape — A huge collection of shapes made with a single HTML element and pure CSS, and you can click to view any shape to customize and/or view and copy the code.

CSS Shape

The Good Colors — A tool that creates a color palette using OKLCH, which ensures consistent perceptual changes in lightness and chroma, and supports wide gamut displays and checks contrast ratios using APAC.

WyW-in-JS — Short for "Whatever-you-want-in-JS," this is a toolkit for creating zero-runtime CSS-in-JS libraries, so you can build your own solutions with arbitrary syntax, functionality, and independent from specific implementations.

Signals for Tailwind CSS — A Tailwind plugin that relies on the new Style Queries CSS feature to reactively enable a custom state, which can then be consumed by any of its descendants in the DOM.

Ninja Backgrounds — A gallery of plug and play modern backgrounds made with Bootstrap, CSS variables, and plain CSS.

Tailblocks — An online tool to auto-convert Tailwind HTML to WordPress Block code with editable Gutenberg styles.

ChatGPT and AI Tools

Spec API — A JavaScript package to quickly spec your APIs for the Swagger / OpenAPI interface, using sleeksky/alt-schema for specifying JSON schema.

Rispose — Embed a free AI assistant on your website that's trained on your data, with up to 10,000 files permitted for training.

unstock.ai — AI-generated logos, icons, illustrations, and stock photography, available in SVG and PNG formats, with ability to custom create your own with a prompt.

unstock.ai

Perplexica — An AI-powered search engine that's an open-source alternative to Perplexity AI.

Anytime Mailbox — Business starters, are you in need of a business address separate from your home? Anytime Mailbox provides a seamless solution, securing a private, professional address with added benefits like mail forwarding and scanning for ultimate convenience.     SPONSORED 

FireCrawl — An API service that takes a URL, crawls it, and converts it into clean LLM-ready markdown, no sitemap required.

Open WebUI — An extensible, feature-rich, and user-friendly self-hosted WebUI designed to operate entirely offline, with support for various LLM runners, including Ollama and OpenAI-compatible APIs.

Morphic — An AI-powered search engine with a generative UI, built with Next.js, shadcn/ui, Radix, etc.

FreeGPT35 — A Node.js package that lets you utilize the unlimited free GPT-3.5-Turbo API service provided by the login-free ChatGPT Web.

Scalar — A platform to build open-source tools (a testing client, docs, mock server, etc.) with first class OpenAPI support.
Advertisement

The Morning Paper for Hacker News Readers
Want a byte-sized version of Hacker News that takes just a few minutes to read? 

Try TLDR's free daily newsletter.

TLDR covers the most interesting tech, startup, and programming stories in under 5 minutes.

TLDR

No sports. No politics. No weather.

TLDR is read by 1,250,000 software engineers, founders, and tech workers.

Subscribe for Free →


 

JavaScript Utilities

Google Indexing Script — A Node.js script to get your website indexed on Google in less than 48 hours using the Google API (within the limits that the API allows).

gpu-curtains — A small, lightweight WebGPU rendering engine that can be used as a genuine 3D engine by turning HTML elements into textured planes, allowing you to animate them via WGSL shaders.

CrossWS — An elegant, typed, and simple interface to implement platform-agnostic WebSocket servers.

Anytime Mailbox — Business starters, are you in need of a business address separate from your home? Anytime Mailbox provides a seamless solution, securing a private, professional address with added benefits like mail forwarding and scanning for ultimate convenience.     SPONSORED 

Sloth Pipe — A tiny library for TypeScript and JavaScript that lets you create lazy, chainable, and reusable pipes for data transformation and processing.

Sloth Pipe

abort-utils — A set of utility functions that enable you to use and combine `AbortSignal` and `AbortController` with Promises.

@epic-web/invariant — A set of type safe utilities for throwing errors (and responses) in exceptional situations in a declarative way.

RE2JS — A JavaScript port of RE2 (a popular C++ library by Google), a regular expression engine that provides linear time matching.

znv — Type-safe environment parsing and validation for Node.js with Zod schemas.

chardet — A character detection module written in pure JavaScript/TypeScript that uses occurrence analysis to determine the most probable encoding.

Commercial Apps & Classifieds

These are commercial apps, affiliate links, PPC ads, and paid classifieds. Buy a Classified here.
PromptStart – An AI starter toolkit to build useful and engaging everyday tools, powered by AI.
TLDR – A byte-sized version of Hacker News that takes just a few minutes to read.   AD 
ShipAIFast – Skip weeks of development with prebuilt AI-ready apps using Next.js and Supabase.
Edge Store – A service with CDN and storage to implement file uploads in your app.
Techpresso – Join 100,000+ free daily readers for the latest AI and tech news, tools, and insights.    AD 
NewOaks AI – A service to add a chatbot to your website to help convert leads and inquiries.
Tailwind Animations – A suite of beautiful, copy/paste, prebuilt CSS animations made with Tailwind.

An X Post for Thought

It's pretty wild to think that Google was using advanced Ajax functionality inside Gmail, which launched in 2004, about a year before Jesse James Garrett's famous article on Ajax. Google certainly have their flaws and controversies, but they have innovated as much as anyone on the web.
 
An X Post for Thought
 

Send Me Your Tools!

Made something? Reply to this email or send links via Direct Message on X @LouisLazaris (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
 

Before I Go...

NoteQuiz is a simple way to test your knowledge of music notation, useful for beginners learning to sight read.

Thanks to everyone for subscribing and reading!

Keep tooling,
Louis
@LouisLazaris
PayPal.me/WebToolsWeekly

Older messages

Web Tools #564 - JS Utilities, React Tools, Uncats

Thursday, May 9, 2024

WEB VERSION Issue #564 • May 9, 2024 Advertisement Support Web Tools Weekly via GitHub Sponsors It's getting harder and harder to find viable advertising options for a small- to medium-sized

Web Tools #563 - Frameworks, JSON/DB Tools, Vue, Nuxt.js

Thursday, May 2, 2024

WEB VERSION Issue #563 • May 2, 2024 Advertisement The Complete JavaScript Course 2024: From Zero to Expert This is an up-to-date JavaScript course covering modern techniques and features that will

Web Tools #562 - Voilà Review, CSS Tools, Media, React Native

Thursday, April 25, 2024

WEB VERSION Issue #562 • April 25, 2024 The following is a paid product review for Voilà, an AI assistant for the browser that enables you to improve your writing, coding, brainstorming, and research

Web Tools #561 - Popover Modals, React Tools, Git/CLI, Uncats

Thursday, April 18, 2024

WEB VERSION Issue #561 • April 18, 2024 Advertisement $47 Million in Artwork Sales Equals Profits for These Everyday Investors — Masterworks is taking on the billionaires at their own game, buying up

Web Tools #560 - Popover API, Frameworks, ChatGPT, JS Utils

Saturday, April 13, 2024

WEB VERSION Issue #560 • April 11, 2024 Advertisement $47 Million in Artwork Sales Equals Profits for These Everyday Investors — Masterworks is taking on the billionaires at their own game, buying up

You Might Also Like

Import AI 399: 1,000 samples to make a reasoning model; DeepSeek proliferation; Apple's self-driving car simulator

Friday, February 14, 2025

What came before the golem? ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Defining Your Paranoia Level: Navigating Change Without the Overkill

Friday, February 14, 2025

We've all been there: trying to learn something new, only to find our old habits holding us back. We discussed today how our gut feelings about solving problems can sometimes be our own worst enemy

5 ways AI can help with taxes 🪄

Friday, February 14, 2025

Remotely control an iPhone; 💸 50+ early Presidents' Day deals -- ZDNET ZDNET Tech Today - US February 10, 2025 5 ways AI can help you with your taxes (and what not to use it for) 5 ways AI can help

Recurring Automations + Secret Updates

Friday, February 14, 2025

Smarter automations, better templates, and hidden updates to explore 👀 ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

The First Provable AI-Proof Game: Introducing Butterfly Wings 4

Friday, February 14, 2025

Top Tech Content sent at Noon! Boost Your Article on HackerNoon for $159.99! Read this email in your browser How are you, @newsletterest1? undefined The Market Today #01 Instagram (Meta) 714.52 -0.32%

GCP Newsletter #437

Friday, February 14, 2025

Welcome to issue #437 February 10th, 2025 News BigQuery Cloud Marketplace Official Blog Partners BigQuery datasets now available on Google Cloud Marketplace - Google Cloud Marketplace now offers

Charted | The 1%'s Share of U.S. Wealth Over Time (1989-2024) 💰

Friday, February 14, 2025

Discover how the share of US wealth held by the top 1% has evolved from 1989 to 2024 in this infographic. View Online | Subscribe | Download Our App Download our app to see thousands of new charts from

The Great Social Media Diaspora & Tapestry is here

Friday, February 14, 2025

Apple introduces new app called 'Apple Invites', The Iconfactory launches Tapestry, beyond the traditional portfolio, and more in this week's issue of Creativerly. Creativerly The Great

Daily Coding Problem: Problem #1689 [Medium]

Friday, February 14, 2025

Daily Coding Problem Good morning! Here's your coding interview problem for today. This problem was asked by Google. Given a linked list, sort it in O(n log n) time and constant space. For example,

📧 Stop Conflating CQRS and MediatR

Friday, February 14, 2025

​ Stop Conflating CQRS and MediatR Read on: m​y website / Read time: 4 minutes The .NET Weekly is brought to you by: Step right up to the Generative AI Use Cases Repository! See how MongoDB powers your