Weekly Web Design & Development News: Collective #605
Everything you need to know in development & design this week, rounded up for you (Week 21, 2025).
You'll find the most essential things right now: Javascript & CSS libraries, useful code snippets, crucial web dev news & resources, curated AI tools, free design assets, and plenty of other good stuff we found!
Subscribe to our newsletter to get a weekly list of new web dev resources in your inbox.
JavaScript & CSS
Shadcn marketing blocks - Notion-Style Shadcn/UI Blocks for Marketing Websites. (Live Demo)
Basecoat - Modern UI Components for Any Web Stack.
cnblocks - 50+ Svelte 5 UI Blocks with Tailwind CSS & shadcn/ui. (Live Demo)
paceui - Animated UI Components Built with GSAP for Next.js Apps. (Live Demo)
tailwindcss-github-markdown - Apply GitHub’s Markdown Styling to Tailwind
solid-charts - Composable SVG Charts for SolidJS. (Live Demo)
svelte-scroll-trackerr - Lightweight Progress Tracking Component. (Live Demo)
ForesightJS - Predict User Intent Based On Mouse Movements. (Live Demo)
bootstrap-5-modal-dynamic - Dynamic Bootstrap 5 Modals via HTML Data Attributes. (Live Demo)
Animatry - Coverflow Card Carousel with JavaScript and CSS/CSS3. (Live Demo)
mason-it - Responsive Masonry Layouts with CSS Grid. (Live Demo)
ray-editor - Lightweight WYSIWYG Editor for Modern Web Apps. (Live Demo)
stacked-slider - 3D Stacked Carousel with JavaScript and Tailwind CSS. (Live Demo)
t
Filemoji - Auto-add File Type Emojis to Your Document Links. (Live Demo)
backPopup - Back Button Popup Library for Lead Generation. (Live Demo)
Password-Strength-Checker - Vanilla JS Password Strength Checker for Better Form Security. (Live Demo)
bootstrap5-confirm-popover - Simple Confirmation Dialogs on Click. (Live Demo)
better-auth - The most comprehensive authentication framework for TypeScript. (Live Demo)
render-hooks - Inline render-block-stable React hooks. (Live Demo)
with-react - A collection of React components that wrap React hooks to provide a more composable API.
fastapi-ignite - A production-ready FastAPI boilerplate application with a comprehensive set of features for modern web backend development.
three-geojson - Three.js shape loaders for GeoJSON and WKT formats. (Live Demo)
LudoGL - A WebGL2-only renderer built from scratch for learning purposes.
thebrowserlab - A 3D editor and creative coding environment that runs entirely in the browser. (Live Demo)
altcha - GDPR, WCAG 2.2 AA, and EAA compliant, self-hosted CAPTCHA alternative with PoW mechanism and advanced anti-spam filter. (Live Demo)
Open-Launch - The first complete open source alternative to Product Hunt. (Live Demo)
HelloCSV - A modern, drop in, frontend only, CSV importer workflow. (Live Demo)
Discover more JavaScript & CSS Libraries →
Web Dev Tools & Resources
llmbasedos - Minimal Linux OS with a Model Context Protocol (MCP) gateway to expose local capabilities to LLMs.
xtool - Cross-platform Xcode replacement. Build and deploy iOS apps with SwiftPM on Linux, Windows, macOS.
GoVisual - Zero-config, pure-Go HTTP request visualizer & debugger for local Go web development.
docmd - Generate beautiful, lightweight static documentation sites from Markdown files.
shadcn-remover - A simple command-line tool to quickly remove Shadcn UI components from your project.
UI Builder + Mockup tool - Sketch UI mockups directly on live websites in Chrome.
Aha Icon - Create professional website icons and favicons online for free.
Graphic Design Freebies
Artify AI Image Editing App UI Kit - 50+ screens to build your next photo app.
50+ Free Social & AI Icons - 50 icons themed around social media and artificial intelligence.
Modern B2B Website Template - A modern website template designed for B2B technology companies, SaaS providers, and engineering firms.
Mesh Gradients - 10 Free Mesh Gradients for Web and Print Design.
SVG Icons - Search, customize, and download high-quality, open-source SVG icons for your projects.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
OpenAI Codex - A cloud-based software engineering agent that answers codebase questions, executes code, and drafts pull requests.
Browse Use - Make websites accessible for AI agents by extracting all interactive elements, so agents can focus on what makes their beer taste better.
Windsurf SWE-1 - Windsurf's first frontier model family, built to accelerate the entire software engineering process, not just coding.
Webifier - The first AI website generator built for makers & agencies.
gh-explorer - AI-powered tool for analyzing GitHub trending repositories and URL metadata.
Pollixir AI - Free and Smart AI Survey & Poll Maker
Auto Mind - AI-Generated Mind Maps That Grow With Your Thoughts.
Codermon AI - Turn GitHub Profiles to 3D Persona Cards.
News & Articles
Start building with Material 3 Expressive (Link)
HTML Email Accessibility Report 2025 (Link)
Building A Practical UX Strategy Framework (Link)
Getting AI to write good SQL: Text-to-SQL techniques explained (Link)
If AI is so good at coding … where are the open source contributions? (Link)
How to have the browser pick a contrasting color in CSS (Link)
JavaScript & CSS Snippets
animated tabs with view transitions
See the Pen animated tabs with view transitions by Danny Moerkerke (@dannymoerkerke) on CodePen.
Million Times Mini Clock Concept
See the Pen Million Times Mini Clock Concept by Vineeth.TR (@vineethtrv) on CodePen.
Hero Mask Reveal (Suz Sirunyan's design) / Filter version
See the Pen Hero Mask Reveal (Suz Sirunyan's design) / Filter version by Antoine Wodniack (@wodniack) on CodePen.
Glowing border with infinite animation (hover for a smooth stop)
See the Pen Glowing border with infinite animation (hover for a smooth stop) by Temani Afif (@t_afif) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #604
- Next: None
