Weekly Web Design & Development News: Collective #610
Everything you need to know in development & design this week, rounded up for you (Week 26, 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
liquid-glass - Liquid Glass effect using SVG filters. (Live Demo)
easy-datetime-picker - Easy Datetime & Date Range Pickers. (Live Demo)
Simple Modal JS - Small Footprint Modals for Web Projects. (Live Demo)
bitmapit-preview - Create Retro ASCII Text Art. (Live Demo)
Resizable Sidebar - VS Code-Style Shadcn/ui Resizable Sidebar for Next.js Apps. (Live Demo)
sb-kit - Drop-in Auth for Next.js + Supabase Projects. (Live Demo)
use-mcp - A lightweight React hook for connecting to Model Context Protocol (MCP) servers.
syntax-highlight-element - Syntax Highlighting using the CSS Custom Highlight API. (Live Demo)
Liquid Glass JS - Apple Liquid Glass-inspired glass effects for the web. (Live Demo)
liquid-glass-react - A pretty weird attempt at making liquid glass for the web.
liquid-glass-svelte: Simulate Apple Liquid Glass on web using Svelte. (Live Demo)
liquid-web - Modern JavaScript library for easy creation of Liquid Glass effect for Vue, React, Vanilla JS. (Live Demo)
liquid-glass-vue - Apple's ios 26 Liquid Glass effect for Vue 3. (Live Demo)
coreui - Open Source UI Kit built on top of Bootstrap 5 and plain JavaScript. (Live Demo)
web-events - Framework-agnostic custom event-driven handling library for the web.
kelp - A UI library for people who love HTML, powered by modern CSS and Web Components.
stellar-id - Generate unique, star-themed IDs from any string input.
Incant - Add magic spells to your code.
openassistant - A javascript library for building AI assistant with powerful tools and interactive React chat component.
animation-timelines - A collection of Custom AnimationTimeline for use with Web Animations. (Live Demo)
react-native-blur - A modern React Native blur view component that provides native blur effects for both iOS and Android platforms.
lisn.js - Simply handle user gestures and actions. Includes widgets. (Live Demo)
Discover more JavaScript & CSS Libraries →
Web Dev Tools & Resources
Liquid Glassifier - Bring liquid glass to your site with a single copy-paste.
Cookie_Editor - A browser extension or tool that allows users to view, edit, create, and delete cookies stored in their browser.
pdf - A powerful, intelligent clipboard management tool with advanced tagging and filtering capabilitiess. (Live Demo)
Personal Clipboard Manager - A browser-based tool lets you upload media and work with SRT/VTT files directly in your browser.
klickbee-cms - Visual builder, fast setup, full control. Built with Next.js, Prisma & Tailwind.
llm-codes - Transform developer documentation to clean Markdown.
Liquid Glass Generator - A real-time WebGL shader implementation for creating authentic liquid glass effects. (Live Demo)
lstr - A fast, minimalist directory tree viewer, written in Rust. (Live Demo)
noxdir - Terminal utility for visualizing file system usage.
Telegram-Scraper - A powerful Python script that allows you to scrape messages and media from Telegram channels using the Telethon library.
harper - Offline, privacy-first grammar checker. Fast, open-source, Rust-powered.
welsonjs - Build a Windows app on the Windows built-in JavaScript engine.
Graphic Design Freebies
iOS Emojis in 3D Figma Icons - A free collection of high-resolution 3D emojis that mirror Apple’s native style for use in digital projects.
24 Free 3D Medical & Healthcare Icons - A set of 24 free medical and healthcare 3D icons for projects like health apps, clinic websites, or patient dashboards.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
claudia - A powerful GUI app and Toolkit for Claude Code.
code-graph-rag - Search Monorepos and get relevant answers.
snap-ql - AI-powered Postgres Client.
claude-sessions - Custom slash commands for Claude Code that provide comprehensive development session tracking and documentation.
DeepSite v2 - A coding platform powered by DeepSeek AI, designed to make coding smarter and more efficient.
Midjourney V1 - Midjourney's first AI video model that creates short video clips from any picture.
Gemini 2.5 Flash-Lite - Google's fastest and most cost-friendly model so far.
Hailuo 02 - MiniMax's latest AI video generation model, best effect, ultra-clear quality, precise response.
News & Articles
Using await at the top level in ES modules (Link)
JSON module scripts are now Baseline Newly available (Link)
A new way to style gaps in CSS (Link)
A Better API for the Resize Observer (Link)
5 tips for using GitHub Copilot with issues to boost your productivity (Link)
JavaScript & CSS Snippets
Dynamic Toggle with [type=radio] + :has()
See the Pen Dynamic Toggle with [type=radio] + :has() by Jhey (@jh3y) on CodePen.
magnetic cursor
See the Pen magnetic cursor by ashish (@ashish1729) on CodePen.
Nice details accordion
See the Pen Nice <details> accordion by Adam Argyle (@argyleink) on CodePen.
Portfolio Landing Page
See the Pen Portfolio Landing Page by Leonam Silva de Souza (@leonam-silva-de-souza) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #609
- Next: None
