Weekly Web Design & Development News: Collective #618
Everything you need to know in development & design this week, rounded up for you (Week 34, 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:
- Slash your
node_modulesdirectory size by up to 60% withprune-mod. - Instantly extract an image's dominant colors with this handy JavaScript library.
- Build powerful multi-step forms with conditional logic in React using Formity.
- Clone any website directly into a React app for free with the
Open LovableAI tool. - Get up to speed with the new CSS anchor positioning feature with a gentle introduction.
- Grab a massive collection of over 7,700 free and editable stroke icons.
- + 27 other great resources and tools
- + 5 new articles and tutorials
Subscribe to our newsletter to get a weekly list of new web dev resources in your inbox.
JavaScript & CSS
major-color-picker - Extract Dominant Image Colors in JavaScript.
Dialog Modal - Modern Dialog Modals with Invoker Command API.
restore-scroll - Scroll Position Restoration for Any Scrollable Container.
simpui - Modern UI Components with CSS and Vanilla JavaScript.
allonsh.js - Native elementFromPoint Drag & Drop Library.
scrollspy - Tiny JavaScript ScrollSpy Library for Smart Navigation Highlighting.
SoMuchSharing - Floating Social Sharing Widget with Confetti Effects.
expo-stack-bottom-sheet - Stackable Bottom Sheet with Reanimated 3 for React Native.
expo-ios-visual-blur - Native iOS Progressive Blur for React Native & Expo.
loading-indicator - Native React Native Loading Indicators with Material 3 Design Support.
expo-fab - Animated FAB Menu with Glassy Blur Effects for React Native.
switch - Enhanced Native iOS & Android Switch Component for React Native.
react-native-reanimated-modal: Performant React Native Modal Component with Reanimated.
Formity - Build Smart Multi-Step Forms with Conditional Logic in React.
evilcharts - Build Interactive Charts with shadcn/ui & Recharts.
reui - 60+ Copy-and-paste UI Components to Build Apps Faster.
prostore - Build Modern Online Stores with Prostore Next.js e-commerce Starter.
Page Editor - On-Page Content Editing for Alpine Projects.
Production-Ready Template - Next.js + Stripe + Supabase Production-Ready Template.
OmniAI-Utils - A JavaScript library providing advanced AI and general utility functions.
webapp-starter - A monorepo template for building webapps - perfect for LLMs.
Responsive Coffee Website - Responsive Coffee Website Usign HTML CSS JavaScript.
Discover more JavaScript & CSS Libraries →
Web Dev Tools & Resources
Markdown to HTML Converter - A free, privacy-first Markdown to HTML converter with real-time preview, advanced customization, and clean, semantic output.
embed-pdf-viewer - A PDF viewer that seamlessly integrates with any JavaScript project.
browser-echo - Stream browser logs to terminal, zero setup, perfect for Ai Agents.
shadcn-ui-mcp-server - A mcp server to allow LLMS gain context about shadcn ui component structure,usage and installation,compaitable with react,svelte 5,and vue.
showmaker - Markdown to Slide desktop tool.
prune-mod - Fast and efficient tool to reduce node_modules size by up to 60%.
visaverse - An interactive 3D visa requirements visualizer that helps travelers explore global travel freedom.
self.so - LinkedIn -> personal site generator.
Graphic Design Freebies
AI Tool Icons - 24 Free Duotone Icons for AI Tools.
Free Webpage Templates - 60+ Free Webpage & Landing Page Templates.
SEO & Marketing Icons - 50+ Free SEO & Marketing Icons.
Stroke Icons - 7700+ Free Editable Stroke Icons.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
Omnara - Free AI Agent Monitor for Cursor, Claude Code, and More.
AI Vector - Free AI Image to SVG Converter with 99.9% Accuracy.
Open Lovable - Clone Any Website Into React Apps for Free.
AionUi - Free & Open-source GUI for Gemini CLI.
Octofriend - Privacy-First Command-line AI Coding Assistant.
Google Imagen 4 - Google's newest image generation engine, capable of creating richer images, with more nuanced colors, intricate details and superior typography.
v0 - The new v0 uses agentic AI to plan, research, build, and debug. It works in context, across multiple steps, and adapts as you go.
open-swe -An open-source cloud-based asynchronous coding agent built with LangGraph.
OpenAI Codex - A command-line coding agent from OpenAI that runs locally on your computer. Now powered by GPT-5.
News & Articles
A gentle introduction to anchor positioning (Link)
Designing With AI, Not Around It: Practical Advanced Techniques For Product Design Use Cases (Link)
Thinking Deeply About Theming and Color Naming (Link)
A Quick Guide to a Multi-Language Astro Site (Link)
A Friendly Introduction to SVG (Link)
JavaScript & CSS Snippets
Animated navigation with GSAP, mix-blend-mode and boxicon web components v2
See the Pen Animated navigation with GSAP, mix-blend-mode and boxicon web components v2 by Josh Dillon (@jdillon) on CodePen.
Animated Digital Clock (React)
See the Pen Animated Digital Clock (React) by Chris Gannon (@chrisgannon) on CodePen.
Polished Button Collection
See the Pen CodePen Challenge: Shine by Gemma Croad (@GemmaCroad) on CodePen.
list stack with view transitions
See the Pen list stack with view transitions by Danny Moerkerke (@dannymoerkerke) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #617
- Next: None
