Weekly Web Design & Development News: Collective #645
Everything you need to know in development & design this week, rounded up for you (Week 9, 2026).
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:
- Our massive 2026 "Top 10" audit kicks off this week, bringing you fully updated, modern library recommendations for your next project.
- Say hello to the brand new HTML
<geolocation>element that's making its way to browsers. - Instantly extract any website's complete design system (colors, typography, borders) into tokens using Dembrandt.
- Render fully 3D HTML cuboids right in the DOM with the mind-bending new VoxCSS voxel engine.
- It's a massive week for AI drops, featuring Claude Sonnet 4.6, Gemini 3.1 Pro, and fresh local-first dev agents.
- 20 other great web dev resources and NextGen JS tools
- +3 fresh graphic design freebies and UI kits
- +3 more industry news updates you shouldn't miss
Subscribe to our newsletter to get a weekly list of new web dev resources in your inbox.
The 2026 Top 10 Series
Get your tech stack ready for the year ahead.
We've started our massive annual audit. We are rewriting and updating our most popular "Top 10" lists to ensure every library recommendation is modern, maintained, and ready for 2026 projects.
Updated this week:
10 Best Terminal Emulators In JavaScript And jQuery (2026 Update)
10 best JavaScript/jQuery powered terminal emulators that add customizable, extensible bash terminals to the web applications, with built-in and/or user-defined commands.
10 Best Page Transition Plugins In JavaScript (2026 Update)
10 best Vanilla JavaScript Libraries and jQuery Plugins that enable you to quickly implement page transition effects on websites or web apps.
10 Best Mobile-friendly One Page Scroll Plugins (2026 Update)
10 best one page scroll jQuery & Vanilla JavaScript plugins that work perfectly on both desktop and mobile.
10 Best Reading Progress Indicators In JavaScript & CSS (2026 Update)
10 best reading progress indicators implemented in jQuery, Vanilla javaScript or Pure CSS.
10 Best Scrollspy Plugins In JavaScript (2026 Update)
10 best jQuery and Vanilla JavaScript scrollspy plugins that can be used to keep track of what elements currently are on the screen.
10 Best Sticky Sidebar Plugins In JavaScript (2026 Update)
10 best Vanilla JavaScript (and jQuery) Smooth Scroll plugins to bring the smooth scrolling experience on your long web page.
10 Best Scroll-triggered Animation Plugins With JavaScript (2026 Update)
10 best jQuery plugins and vanilla JavaScript animate on scroll (AOS) libraries that help developers to create awesome reveal animations on elements when they're scrolled into view.
10 Best Sticky Header Navigation Systems In JavaScript (2026 Update)
10 best and top downloaded jQuery and/or Vanilla JavaScript plugins to create advanced sticky header navigation for your websites.
10 Best Image Annotation Tools In JavaScript (2026 Update)
10 best, free, client-side image annotation tools written in jQuery and Vanilla JavaScript.
7 Best Duration Pickers In JavaScript (2026 Update)
7 best jQuery and Vanilla JavaScript plugins to quickly implement a duration picker on your next web project.
JavaScript & CSS
lowmo - Pause, Slow, or Speed Up Web Animations.
Peek.js - Smart Scroll-Aware Header Navigation Library.
Hover Effects - 7 Creative Hover Effects Using CSS Box-Shadow.
Quickpick UI - Fast Touch-Friendly Picker Library for JavaScript & React.
envelope - Lightweight MS Office Document to HTML Parser.
jspt - Modern JavaScript Toast Notification & Modal Popup Library.
Discover more JavaScript & CSS Libraries →
NextGen JavaScript
soundcn - 700+ UI Sound Effects for Modern Web Apps.
SvelterApp - SvelteKit Dashboard Starter Template with RBAC and Multi-Tenancy.
Waveform Playlist - Multi-Track Audio Editor Built with React and the Web Audio API.
rari - React Server Components Framework on a Rust Runtime.
react-native-tailwind - Compile-time Tailwind CSS for React Native with zero runtime overhead.
buttony.ui - Minimalist buttons with eye-catching effects for your next project. .
liquid-effect-animation - An interactive liquid distortion effect component for React.
VoxCSS - A CSS voxel engine. A 3D grid for the DOM. Renders HTML cuboids by stacking grid layers and applying transforms.
Web Dev Tools & Resources
dembrandt - Extract any website’s design system into tokens in seconds: logo, colors, typography, borders & more.
visual-json - The Visual JSON Editor. Schema-aware, embeddable, extensible.
x-cli - CLI for X/Twitter API v2 -- post, search, like, bookmark from your terminal.
Haven - Self-hosted private chat — No cloud, no telemetry, no Big Tech.
box-of-rain - Auto-layouted ASCII/svg diagrams generated from simple configuration.
textweb - A text-grid web renderer for AI agents — see the web without screenshots.
respectlytics - Privacy-first mobile analytics. Self-hosted, session-based, 5-field storage.
fetch-network-simulator - A development-time API request/response network behavior simulator for frontend applications.
check-ai - Audit any repository for AI-readiness.
perspective - A data visualization and analytics component, especially well-suited for large and/or streaming datasets.
webui - Use any web browser or WebView as GUI, with your preferred language in the backend and modern web technologies in the frontend, all in a lightweight portable library.
Graphic Design Freebies
3D Clay Icons - 200+ Free 3D Clay Icons (A-Z, Numbers, UI).
Finvo - Free Fintech UI Kit for Banking Apps.
Gardening Mobile App UI Kit - Smart Gardening Mobile App UI Kit for Figma.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
Hermes Markdown - Fere Local-First AI Prompt Editor with 35+ Templates.
Voicebox - Free Open-Source Voice Cloning That Runs Locally.
Moltis - Personal AI Agent for Secure Local Automation (OpenClaw Alternative).
SoulX-Singer - Free AI Singing Voice Cloning Tool.
Gemini 3.1 Pro - A smarter model for your most complex tasks.
Claude Sonnet 4.6 - A full upgrade of the model’s skills across coding, computer use, long-context reasoning, agent planning, knowledge work, and design.
Grok 4.2 (public beta) - A major update to xAI’s chatbot, featuring a “rapid learning” architecture designed for weekly improvements.
Qwen 3.5 - Features a 397B total/17B active parameter Mixture-of-Experts (MoE) architecture, offering high-performance, native vision-language understanding (text, images, video), and improved inference efficiency for agentic AI tasks.
Kimi Claw - A cloud-native, 24/7 browser-based AI agent service launched by Moonshot AI.
Seed2.0: - A suite of AI models is for high-performance multimodal, reasoning, and agent-based tasks.
Lyria 3 - Generate 30-second tracks based on images, videos, and text descriptions.
News & Articles
WebMCP is available for early preview (Link)
How AI is reshaping developer choice (and Octoverse data proves it) (Link)
Interop 2026 is here, continuing the mission of improving cross-browser interoperability. (Link)
Introducing the geolocation HTML element. (Link)
JavaScript & CSS Snippets
Split to Reveal
See the Pen Split to Reveal by Ryan Yu (@iamryanyu) on CodePen.
morphing feedback popover w/ motion
See the Pen morphing feedback popover w/ motion by Vivi Tseng (@vii120) on CodePen.
Vertical Clock
See the Pen Vertical Clock by Carlos (@cdmoro) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #644
- Next: None
