Weekly Web Design & Development News: Collective #589

by jQueryScript,

A roundup of the latest and most popular development & design resources (Javascript & CSS libraries, Code snippets, Web Dev News & Resources, Curated AI Tools, Graphic Design Freebies, etc.)  from the past week (Week 4, 2025).

Subscribe to our newsletter to get a weekly list of new web dev resources in your inbox.

JavaScript & CSS

Modern One Page Scroll Web Template - A modern One Page Scroll website template that combines responsive navigation and smooth scrolling animations. (Live Demo)

Yetialerts

Yetialerts - A lightweight JavaScript library to display customizable toast- and growl-style alert notifications. (Live Demo)

Yetialerts

Masky - A tiny but powerful JavaScript library for handling input masking (like phone numbers, dates, or credit card numbers) in your web apps.. (Live Demo)

Masky

cs16.css - CSS library based on Counter Strike 1.6 UI. (Live Demo)

motion-primitives - UI kit to make beautiful, animated interfaces, faster. Customizable. Open Source. (Live Demo)

jsonquery - A lightweight, flexible, and expandable JSON query language.

aws-ai-stack - A ready-to-use, full-stack boilerplate project for building serverless AI applications on AWS. (Live Demo)

app-tailwind-v4 - Shadcn/ui + tailwind v4. (Live Demo)

Alchemy - A minimal, embeddable, JS-native Infrastructure-as-Code library designed with gen-AI in mind.

envoyjs - A simple JavaScript framework for building AI agents. (Live Demo)

bevy_flair - Bevy UI styling using CSS.

cute-kuma - Cute CSS for Uptime Kuma status page with a simple and modern look. (Live Demo)

Lizzy.js - Zero-dependency, no-build, copy-paste, client-side rendering framework for listing and rendering markdown content.

Modern Time Picker - A Time Picker component for React.js.

fancy-react-ui - A modern, customizable React component library featuring beautiful UI components and loading animations. (Live Demo)

neutrix - A state management library thats lighter and better. (Live Demo)

Discover more JavaScript & CSS Libraries →


Web Dev Tools & Resources

tailwind-perspective - A tool to visualize the new Tailwind CSS 3d transform perspective utilities.

Lightpanda - The headless browser designed for AI and automation.

Yek - A fast tool to read text-based files in a repository or directory, chunk them, and serialize them for LLM consumption.

Refreshrate - A real-time tool to monitor your screen's refresh rate and FPS.

itoa - Converts an image to ASCII art.

php-ext - A chrome extension to show PHP (Laravel) devtools console.

Inkless - A minimal, lightweight (less than 4 MB), shortcut-based text editor.

QuickNav - A Chrome extension that lets you instantly navigate to your favorite websites using customizable keyboard shortcuts.


Graphic Design Freebies

Quibble - Quibble Playful Font for Cheerful Designs.

Quibble

Yesicon - 249,084 High-Quality Vector Icons from Top Design Teams.

Iconmonstr - 4784+ free icons in 316 collections.

Discover more Graphic Design Freebies →


Curated Free AI Tools

SarvScribe - Secure Audio/Video Transcription Right in Local.

Raphael - Free & Unrestricted Flux AI Image Generator.

Exist Yet AI - Free Idea Validation: Discover Market Gaps with AI.

Discover more Free AI Tools →


News & Articles

The 2025 state of AIDevelopment (Link)

Top Pens of 2024 on CodePen (Link)

Bun released v1.2. (Link)


JavaScript & CSS Snippets

1 div halftone-masked background card (no Firefox)

See the Pen 1 div halftone-masked background card (no Firefox) by Ana Tudor (@thebabydino) on CodePen.


Dropbox Color Picker

See the Pen Dropbox Color Picker by Chris Gannon (@chrisgannon) on CodePen.


Filter on image vs gradient backgrounds

See the Pen Filter on image vs gradient backgrounds by Amit (@ghaste) on CodePen.


Interactive Card with Floating Lightbox Images

See the Pen Interactive Card with Floating Lightbox Images by marcello (@tofjadesign) on CodePen.