Weekly Web Design & Development News: Collective #607
Everything you need to know in development & design this week, rounded up for you (Week 23, 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
animate-ui - Motion-Powered Animated Components for Modern UIs. (Live Demo)
shadcn-prose - Pre-Styled Typography for shadcn/ui Projects. (Live Demo)
smooothy - Tiny real smooth fast cool all events and evenn more responsive bring your own tooling slider. (Live Demo)
Reactwind - Open-Source Tailwind CSS Dashboard Template. (Live Demo)
Orbit Menu - Interactive Radial Menus in JavaScript. (Live Demo)
cue.js - Build Interactive Product tours & User Onboarding. (Live Demo)
UniversalShare - Social Share Buttons Plugin with Custom Popup Support. (Live Demo)
shadcn-ui-blocks - Ready-Made shadcn/ui Blocks & Components for Modern Web Dev. (Live Demo)
Indie UI - 20+ Animated UI Components with shadcn/ui & Framer Motion. (Live Demo)
CSS Minecraft: A Minecraft clone made with pure HTML & CSS – no JavaScript.
Defuddle - Extract the main content from web pages. (Live Demo)
react-wheel-picker - Smooth iOS-Style Selection for Web Apps. (Live Demo)
Tesseral - Open source auth infrastructure for B2B SaaS. (Live Demo)
errsole.js - Collect, Store, and Visualize Logs with a Single Module.
LogLayer - A modern logging library for Javascript / Typescript that routes logs to various logging libraries, cloud providers, files, and OpenTelemetry while providing a fluent API for specifying log messages, metadata and errors. (Live Demo)
super-utils-plus - A superior alternative to Lodash with improved performance, TypeScript support, and developer experience.
code_timeline_preview - Transforming Code into Engaging Visual Timelines. (Live Demo)
protectjs - Implement robust data security without sacrificing performance or usability.
Enwrap - A tiny (423 bytes gzipped) and dependency-free library that allows you to wrap functions and return typed errors.
Iron Interface - An interactive 3D particle visualization controlled through hand gestures and voice. (Live Demo)
pdftoimg-js - A javascript library that help to convert pdf to img in both platform nodejs and frontend library/framework like React, Nextjs and more.
tsc.run - A minimal framework for building serverless applications in TypeScript.
html2react - A powerful utility that transforms HTML files into fully functional React components with proper JSX syntax.
Discover more JavaScript & CSS Libraries →
Web Dev Tools & Resources
PasteMax - A modern file viewer application for developers to easily navigate, search, and copy code from repositories.
Task Magic - A complete task management system using Cursor/Windsurf rules.
markdown-ninja - A powerful extension that brings JavaScript capabilities to SQLite.
NxLite - Lightning-fast HTTP server built in C.
Params Editor - The smartest way to edit URL parameters in Chrome.
Superglue - One SDK to manage all your data pipelines.
Graphic Design Freebies
Kelmscott Mono Font - An open-source blackletter for the text & code editors.
IBM Carbon Icons Pack Figma - A complete SVG icon library with over 2,000 professionally designed icons for web and app projects.
AI Product Logos in Figma - High-quality brand icons for modern projects.
Playful Doodle Shapes Figma - A collection of free, playful doodle shapes including rainbows, flowers, stars, suns, hearts, and more.
Discover more Graphic Design Freebies →
Curated AI Tools for Developers and Designers
Kamili - Enhance your website with friendly, AI-powered guidance
Wireframer - AI builds the layout. You bring the rest.
FLUX.1 Kontext - A suite of generative flow matching models that allows you to generate and edit images.
Kling AI 2.1 - The KLING 2.1 lineup has arrived! KLING 2.1 now offers 720p & 1080p, and the KLING 2.1 Master is fully 1080p for superb performance.
DeepSeek R1 0528 - The latest and most powerful version of DeepSeek R1 reasoning AI model. Now available in its official chat UI and API.
News & Articles
GitHub for Beginners: Building a React App with GitHub Copilot (Link)
Path to a free self-taught education in Computer Science (Link)
Angular v20 Released (Link)
Why are 2025/05/28 and 2025-05-28 different days in JavaScript? (Link)
Web Sustainability Guidelines (WSG) (Link)
Particle Life simulation in browser using WebGPU (Link)
JavaScript & CSS Snippets
Button Hover Effect: Cursor-Based Glow Pulse
See the Pen Button Hover Effect: Cursor-Based Glow Pulse by Franco Beltramella (@Franbeltramella) on CodePen.
box / box-shadow + vertical transition elongating the shadow
See the Pen box / box-shadow + vertical transition elongating the shadow. by Tom Hermans (@tomhermans) on CodePen.
Wheel Timeline - pure CSS
See the Pen Wheel Timeline - pure CSS by Chris Bolson (@cbolson) on CodePen.
Aura Button Effects
See the Pen Aura Button Effects by Nodws (@nodws) on CodePen.
Basic Neo Brutalist Component Library
See the Pen Basic Neo Brutalist Component Library by Rustcode (@rustcode) on CodePen.
- Prev: Weekly Web Design & Development News: Collective #606
- Next: None