Weekly Web Design & Development News: Collective #622
Everything you need to know in development & design this week, rounded up for you (Week 38, 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:
- Meet Andromeda, a blazing-fast JavaScript & TypeScript runtime built in Rust.
- Learn how to create stunning "Liquid Glass" UI effects using only CSS and SVG.
- Generate 3D models from text or images with the free AI tool, CADAM.
- Snag the best free mockups for the new iPhone 17 and Google Pixel 10.
- Turn text into diagrams effortlessly with the modern scripting language, d2.
- A new proposal could let you write LLM instructions directly inside your HTML.
- Build modern React forms in a flash with shadcn-tanstack-form.
- + 42 other great resources and tools
- + 8 design freebies and snippets
Subscribe to our newsletter to get a weekly list of new web dev resources in your inbox.
JavaScript & CSS
shadcn-tanstack-form - Build Modern React Forms with Shadcn/ui and TanStack Form
basecn - shadcn/ui components powered by Base UI.
shadcn-ui-monthpicker - Customizable Month Picker & Month Range Picker for shadcn/ui.
shadcn-lazy-tooltip - Optimize Tooltip Rendering in your App with Shadcn Lazy Tooltip Component.
shadd - Global Shorthand for Smarter & Faster shadcn/ui Component Installation.
tiptap-shadcn - Rich Text Editing for Next.js Apps.
astro-i18n-starter - Build SEO-Optimized Multilingual Websites.
Table-Forge - Accessile Reusable Data Table Components for Next.js.
shadcn-color-picke - Minimal Color Picker Component with shadcn/ui and react-colorful.
bprogress - Modern TypeScript Progress Bar Library.
Smoke/Fluid Motion - Interactive Smoke/Fluid Motion Effects with Canvas and WebGL.
peggrid - Lightweight JavaScript Data Grid with Search, Sort, and CSV Export.
VikCraft-Interactive-Data-Table - Feature-rich JavaScript Data Table Library.
VikCraft Charts - Versatile JavaScript Charting Library (40+ Chart Types Included).
toast-queue - shadcn/ui Sonner-style Toast Notification Library.
suggestify - Lightweight JavaScript Autocomplete for Input Fields.
liquid-glass - iOS 26-style Liquid Glass UI for React Native.
react-native-blur - React Native Blur View with Liquid Glass Effect.
reactnextplayer - Modern Accessible Video Player Component.
option-select - Hierarchical Multi-Select Logic for React & Next.js Apps.
i18n-check - Validate i18n translation files.
inverted-border - inverted-border written in pure CSS.
responsive-portfolio-website-Anid - Build a Modern Responsive Portfolio Website Using HTML CSS & JavaScript.
css-boilerplate - A default CSS structure for projects of any size.
img.css - An opinionated img-only CSS reset and set of defaults.
SaaSBoard - Free and open-source SaaS dashboard template for startups, businesses, and AI Tools.
otpauth - One Time Password (HOTP/TOTP) library for Node.js, Deno, Bun and browsers.
Discover more JavaScript & CSS Libraries →
Web Dev Tools & Resources
Free Markdown to EPUB Converter - Create EPUB books from your Markdown files. Instant, private, and fully customizable.
oq - A terminal-based OpenAPI Spec (OAS) viewer.
24-Hour to 12-Hour Time Converter - Quickly and easily convert 24-hour time to the standard 12-hour AM/PM format.
andromeda - A modern, fast, and secure JavaScript & TypeScript runtime built from the ground up in Rust ???? and powered by Nova Engine and Oxc.
blazediff - Blazing-fast pixel-by-pixel image comparison with block-based optimization.
dalec - Produce secure packages and containers with declarative configurations.
logtape - Simple logging library with zero dependencies for Deno, Node.js, Bun, browsers, and edge functions.
ShieldEye - Advanced browser extension for detecting anti-bot solutions, CAPTCHA services, and web security mechanisms.
d2 - A modern diagram scripting language that turns text to diagrams.
hledger - Robust, fast, intuitive plain text accounting tool with CLI, TUI and web interfaces.
clipboard-image - Get and set images on the macOS clipboard.
thermoptic - A next-generation HTTP stealth proxy which perfectly cloaks requests as the Chrome browser across all layers of the stack.
nodebook - Learn and Master the complex parts of the Node.js Runtime.
Graphic Design Freebies
Best Free iPhone 17 Mockups - Best Free iPhone 17/17 Pro/17 Air Mockups for Designers.
Realistic Google Pixel 10 Mockups Pack - A collection of high-quality, photo-realistic Google Pixel 10 Mockups in Figma.
Modern Mobile Chat App UI Kit for Figma - A collection of three fully responsive screens for Figma designed to accelerate the creation of modern mobile chat app.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
CADAM - Free AI Text-to-3D & Image-to-3D Model Generator.
SEO Mega Report - Free AI-Powered SEO Analysis & Audit Tool.
Mood Palette Generator - Free AI Tool Transforms Words Into Colors.
AIPex - Free AI Browser Automation Extension for Chrome.
GitArsenal CLI - Automate GitHub Repository Setup with GitArsenal CLI AI Agent.
Qwen3-Next-80B-A3B - A next-generation architecture featuring sparse MoE, linear attention, and multi-token prediction, delivering flagship-level instruction-following and reasoning capabilities.
11Labs Voice Remixing - Reimagine any aspect of your own voice or your designed voices to create new characters.
Claude - Claude can now create and edit files.
HunyuanImage-2.1 - An Efficient Diffusion Model for High-Resolution (2K) Text-to-Image Generation.
Seedream 4.0 - Next‑gen image creation model unifying generation and editing in one architecture.
News & Articles
A proposal for inline LLM instructions in HTML based on llms.txt (Link)
Liquid Glass in the Browser: Refraction with CSS and SVG (Link)
Integrating CSS Cascade Layers To An Existing Project (Link)
What You Need to Know About CSS Color Interpolation (Link)
CSS-only scrollspy effect using scroll-marker-group and :target-current (Link)
JavaScript & CSS Snippets
Stacking card
See the Pen Stacking card by Ryan Yu (@iamryanyu) on CodePen.
accordion slider
See the Pen accordion slider by NIDAL (@Nidal95) on CodePen.
Dynamic Slide-in Slide-out Animation
See the Pen Dynamic Slide-in Slide-out Animation by iqq800 (@iqq800) on CodePen.
Smooth Letter Slide-Out Effect
See the Pen Smooth Letter Slide-Out Effect by Calculate Quick (@CalculateQuick) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #621
- Next: None
