Web Tools Weekly
Tools for Web Developers

Issue #633  (CSS/HTML, AI Tools, JS Utils)09/04/25


Advertisement

Cut Code Review Time & Bugs in Half
Code reviews are critical but time-consuming. CodeRabbit acts as your AI co-pilot, providing instant code review comments and potential impacts of every pull request. 

Beyond just flagging issues, CodeRabbit provides one-click fix suggestions and lets you define custom code quality rules using AST-Grep patterns, catching subtle issues that traditional static analysis tools might miss.

CodeRabbit

CodeRabbit has so far reviewed more than 10 million PRs, installed on 1 million repositories, and used by 70 thousand open-source projects. CodeRabbit is free for all open-source repos.

Get Started Today 🡺

 

CSS & HTML Tools

CSS Properties — A complete reference of CSS properties with their release dates and documentation links, allowing you to explore the history and evolution of web styles since the beginning.

Next-Yak — A zero-runtime CSS-in-JS solution, powered by Rust, enabling ability to write styled-components syntax and get build-time CSS extraction, with full compatibility with React Server Components.

CodeRabbit — Cut code review time and bugs in half. CodeRabbit acts as your AI co-pilot, providing instant code review comments and potential impacts of every pull request. Free for all open source repos.   SPONSORED 

MD-TOOL — A suite of Markdown tools to convert Markdown to HTML, HTML to Markdown, and Markdown to PDF.

Style Spark — A design system generator, color palettes generator, HDR gradients generator, and image color extractor, with presets for starting design systems, trending palettes, and other features.

Style Spark

CSS Boilerplate — A default CSS structure for projects of any size that takes the CSS reset concept to a new level by adding a structure using the new Cascade Layers standard.

Tailwind Gradient Generator — A simple interactive gradient generator that automatically displays the Tailwind-specific classes for the desired gradient using Tailwind colors.

baseline-status — A web component that will display the 'baseline status' information of a specified web platform feature, similar to what's found on MDN's docs.

Email Editor — A web-based HTML email editor that allows you to live edit your HTML email using visual settings in a useful sidebar.

AI Tools, LLMs, etc.

js-genai — Google's new AI SDK for TypeScript and JavaScript developers to build applications powered by Gemini, with support for both the Gemini Developer API and Vertex AI.

Dyad — A local, open source AI app builder that's fast, private, and fully under your control, like Lovable, v0, or Bolt, but running right on your machine.

Price Per Token — An up-to-date pricing reference for major LLM APIs including OpenAI, Anthropic, Google, Mistral, and more, allowing you to compare token costs across different AI models and find the best value.

Price Per Token

use-mcp — A lightweight React hook for connecting to Model Context Protocol (MCP) servers, simplifying authentication and tool calling for AI systems implementing the MCP standard.

app.build — An open-source AI agent that builds full-stack apps from scratch on top of the Neon platform, with Neon Postgres, Neon Auth, etc., built in, and the option to use your own templates.

Meco — Enjoy newsletters in a space designed for reading. Meco is a distraction-free space for reading and discovering newsletters, separate from the inbox. Add your newsletters in seconds and liberate your inbox today!   SPONSORED 

Add AI Directory — A searchable directory of AI agents, so you can build a digital productivity workforce in minutes from a categorized list of agents.

Agent Rules — A collection of reusable rules and knowledge documents for AI coding assistants like Claude Code and Cursor.

Browserable — An open source browser automation library that allows you to build browser agents that can navigate sites, fill out forms, click buttons, extract information, and more.
Advertisement

Cut Costs. Not Corners
Economic pressure is rising,  and doing more with less has become the new reality. But surviving a downturn isn’t about stretching yourself thinner; it’s about protecting what matters most.

Belay

BELAY matches leaders with fractional, cost-effective support – exceptional Executive Assistants, Accounting Professionals, and Marketing Assistants –tailored to your unique needs. When you're buried in low-level tasks, you lose the focus, energy, and strategy it takes to lead through challenging times. 

BELAY helps you stay ready for whatever comes next.

Download the Guide 🡺


 

JavaScript Utilities

i18n-check — A utility that validates your ICU and i18next translation files and checks for missing and broken translations, runnable as a pre-commit hook or on the CI.

EmbedPDF — A lightweight, customizable PDF viewer with no dependencies that works seamlessly with any JavaScript project, allows theming, and has an extensive API for complete control.

fast-escape-regexp — A plain JavaScript-based regular expression escaping library for JavaScript that works in the browser and Node.js.

JavaScript Font Picker — A versatile, flexible, and lightweight component that adds a font picker to any app, enabling user access to Google Fonts, custom fonts, and system fonts.

Meco — Enjoy newsletters in a space designed for reading. Meco is a distraction-free space for reading and discovering newsletters, separate from the inbox. Add your newsletters in seconds and liberate your inbox today!   SPONSORED 

OverType — A Markdown-based WYSIWYG editor that consists of a textarea component overlaid on a div, relying on native features to simplify the editor functionality.

OverType

RampenSau — A color palette generation library that utilizes hue cycling and easing functions to generate color ramps, useful for generating color palettes for data visualizations, visual design, generative art, etc.

Feedsmith — A robust and fast JavaScript parser and generator for RSS, Atom, JSON Feed, and RDF feeds, with support for popular namespaces and OPML files.

Quaternion.js — A well tested JavaScript library for 3D rotations that can be used, for example, for doing rotation calculations of mobile phone movement in a game.

Commercial Apps & Classifieds

These are commercial apps, affiliate links, PPC ads, and paid classifieds. Buy a Classified here.
ClackyAI – An agentic coding studio that allows you to collaborate and build production-ready systems.
Refind – The best articles, tailored to your interests. Loved by 540,000+ curious minds.    AD 
iWrite – A platform to create email templates with AI for marketing, business, and more.
Rocket.new – A natural language prompt to develop apps and convert designs to code.
Techpresso – Join 350,000+ free daily readers for the latest AI and tech news, tools, and insights.    AD 
QuickAltText – Chrome extension that uses AI to generate WCAG-compliant alt text for images.
Fillable – A Notion-like form builder for static sites with drag-and-drop and instant embedding.

A Social Post for Thought

I agree with this sentiment. It should be required that cookie notifications allow an easy way to 'reject all' cookies, otherwise it's just a huge nuisance.
 
Cookie notifications not showing 'reject all', on Bluesky
 

Send Me Your Tools!

Made something? Reply to this email or send links via Direct Message on X or via chat on Bluesky (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...

App Stacks is a resource that allows you to learn the origin story and tech stacks behind different apps and tools. Might be interesting to read about how some successful apps got started.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris