Weekly Web Design & Development News: Collective #613
Everything you need to know in development & design this week, rounded up for you (Week 29, 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!
Highlights:
- Big news in the JS ecosystem: NuxtLabs is officially joining Vercel.
- Get ready for native conditional logic in your stylesheets with the new CSS
if()function. - Grab over 70 free, copy-paste blocks for the incredibly popular shadcn/ui.
- Discover Call, a new open-source and AI-native alternative to Zoom and Google Meet.
- Level up your AI skills with a brilliant interactive prompt engineering tutorial from Anthropic.
- Build futuristic interfaces with Cosmic UI, a set of slick SVG-based sci-fi components.
- Check out Reweb, a powerful AI visual builder for Next.js and Tailwind.
- + 37 other great resources and tools
- + 4 design freebies and snippets
Subscribe to our newsletter to get a weekly list of new web dev resources in your inbox.
JavaScript & CSS
Cosmic UI - SVG-Based Sci-Fi UI Components for Modern Web Apps. (Live Demo)
3D Pressable Button - Physically Realistic 3D Button with SVG & CSS3. (Live Demo)
sleek-portfolio - Modern Portfolio Template for Next.js. (Live Demo)
Indiesaas - Next.js SaaS Boilerplate with Better Auth, PostgreSQL & File Uploads. (Live Demo)
Velokit - Next.js Fullstack Starter with Supabase & Prisma. (Live Demo)
ShadcnVaults - 70+ shadcn/ui Blocks for Business Applications. (Live Demo)
Custom Right-Click Menu - Create Contextual Right-Click Menus with Vanilla JavaScript. (Live Demo)
pixelvoyager - Responsive Interactive JavaScript Lightbox & Image Viewer Library. (Live Demo)
easy-tooltips - Lightweight Tooltip Library with Smart Positioning. (Live Demo)
bs-table - Dynamic Interactive Data Table Plugin for Bootstrap. (Live Demo)
photo-particles: Create Interactive Photo Particle Effects with JavaScript and HTML5 Canvas. (Live Demo)
Masker.js - Lightweight Form Validation and Input Masking/Formatting. (Live Demo)
Toastlet Notify - Mobile-friendly Toast Messages for Web Apps. (Live Demo)
vue-bits - An open source collection of animated, interactive & fully customizable Vue components for building stunning, memorable websites. (Live Demo)
rn-maps-clustering - A modern, performant map clustering library for React Native.
eiwaal - A lightweight animation library for React. Built on top of the View Transitions API.
Kona Editor - Rich text editor with plugins based on Slate.js. (Live Demo)
responses.js - A lightweight express.js server implementing OpenAI’s Responses API, built on top of Chat Completions.
simple-chromium-ai - A lightweight TypeScript wrapper for Chrome's built-in AI Prompt API that trades flexibility for simplicity and type safety.
shaders - Zero-dependency canvas shaders that can be installed from npm or designed in Paper. (Live Demo)
rampensau - Color palette generation function using hue cycling and simple easing functions.. (Live Demo)
pickaxe - A Typescript library for building AI agents that scale.
Discover more JavaScript & CSS Libraries →
Web Dev Tools & Resources
vibe-kanban - Kanban board to manage your AI coding agents.
claude-code-templates - CLI tool for configuring and monitoring Claude Code.
ccundo - ccundo seamlessly integrates with Claude Code to provide granular undo functionality.
NoiseGenerator - A simple tool for seamless 2D/3D online noise generation.
Demark - HTML in. MD out. Blink-fast.
rins_hooks - Universal Claude Code hooks collection with cross-platform installer.
Backlog.md - A tool for managing project collaboration between humans and AI Agents in a git ecosystem.
canine - An easy to use intuitive deployment platform for Kubernetes clusters.
gitprobe - Replace 'hub' with 'probe' in any github url to get llm friendly codebase structure.
llms-generator - A web application that automatically generates llms.txt files from any website's sitemap.
Call - An Open-source AI-native alternative to Google Meet and Zoom.
Skill Icons - A simple SVG icon generator for programming languages and technologies.
Graphic Design Freebies
Country Flag SVG Icons - A collection of open-source SVG flag icons available in two distinct aspect ratios.
ase2ttf Pixel Font - A free, open-source pixel typeface that merges the personality of handwriting with a clean, systematic look.
9 Free PDF Icons - 9 professionally crafted PDF icons for developers finding quality file format icons for design projects.
Sea Illustrations + Patterns - 150+ Free Linocut Sea Illustrations + Patterns.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
GPT-4o Ghibli At Home - Free, Private AI Photo Stylizer.
HN Slop - Free AI-Generated Startup Ideas from Hacker News.
Grok 4 - xAI's most powerful AI model.
Kimi K2 - An open-source agentic intelligence model optimized for tool use and complex tasks.
Devstral Small - Mistral's new agentic LLM for software engineering tasks built under a collaboration between Mistral AI and All Hands AI.
Reweb - The AI visual builder for Next.js & Tailwind.
IconCraft - Create premium, production-ready app icons using AI that scale flawlessly across ios and android.
Opencode Agent - AI coding agent, built for the terminal.
21st.dev - Create, Remix and Share UI components with AI.
News & Articles
CSS Cascade Layers Vs. BEM Vs. Utility Classes: Specificity Control (Link)
NuxtLabs is joining Vercel (Link)
Measuring the Impact of Early-2025 AI on Experienced Open-Source Developer Productivity (Link)
Microsoft Edge sets a new standard for speed and responsiveness (Link)
CSS conditionals with the new if() function (Link)
Anthropic's Prompt Engineering Interactive Tutorial (Link)
JavaScript & CSS Snippets
bouncy notification with animated radius
See the Pen bouncy notification with animated radius by Simon Goellner (@simeydotme) on CodePen.
Thin Bar Graph Widget
See the Pen Thin Bar Graph Widget by Jon Kantner (@jkantner) on CodePen.
Glitchy GSAP animated checkboxes
See the Pen Glitchy GSAP animated checkboxes by Josh Dillon (@jdillon) on CodePen.
Infinite Orbit Animation with CSS Trigonometry
See the Pen Infinite Orbit Animation with CSS Trigonometry by Arby (@mobalti) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #612
- Next: None
