Weekly Web Design & Development News: Collective #545
A collection of the latest and hottest design and development resources (Javascript libraries, CSS snippets, Free Graphic Design Resources, etc.) on the web from the last week (Week 12, 2024).
Web Design & Development News: Collective #545
Luna
Customizable React visual effects components that you can copy and paste into your design system. Free. Open Source. Apply it on top of your design system.
[Download]
rc-modal
Beautifully designed Modal Component built with Radix UI and Tailwind CSS.
Pretzel
Pretzel is an open-source, offline browser-based tool for fast and intuitive data exploration and visualization. It can handle large data files, runs locally in your browser, and requires no backend setup. Pretzel makes it easy to manipulate data via visual chained data transform blocks. It's also reactive - chaging an tranform block in the chain automatically updates all transform blocks and charts that follow.
Xzero
A powerful, interactive, JavaScript (ES6)-powered 3D viewer that lets you display 3D models, scenes, and even 360° panoramas directly on your website.
Bytes
A tiny utility library that converts raw byte values into user-friendly formats like “100 KB” or “50 MB”, and vice versa.
svg-pan-zoom
A simple JavaScript library that adds interactive zooming and panning to your SVGs, whether they’re embedded using object element or displayed inline.
Musique.js
Musique.js is a small JS library which aims to help developers easily create melodies for their websites, with pretty much no prior musical knowledge!
Bladewind
Super simple but elegant Laravel blade-based UI component library using TailwindCSS and vanilla Javascript.
mdModal
A dynamic modal library that fetches content from an external Markdown file (.md) and then displays it in a customizable modal window.
Wobbly-Buttons
The Wobbly-Buttons JavaScript library allows you to create a custom, interactive cursor on the page.
As your cursor hovers over a button, the library expands the cursor to match the button’s shape. This visual cue creates a sense of connection between the cursor and the button, making your visitors feel like the button is sticking to their cursor.
Photo Relay
Beautify your pictures in a simple way by cropping, merging, and stickers.
BrowserDiffusion
Chrome extension that augments your website's images with AI.
Toggle Elastic
See the Pen Toggle Elastic by Alvaro Montoro (@alvaromontoro) on CodePen.
Clean Toast Notifications - CSS
See the Pen Clean Toast Notifications - CSS by Josetxu (@josetxu) on CodePen.
Valorant Characters Banner
See the Pen Valorant Characters Banner by Yudiz Solutions Limited (@yudizsolutions) on CodePen.
Card Slider
See the Pen Card Slider by Curtis Lawrence (@MisterCurtis) on CodePen.
Tabs based on the details tag
See the Pen Tabs based on the details tag by RYJASM (@RYJASM) on CodePen.
Upscale Your Favorite Anime Images/Videos With APISR AI
An AI solution for super-resolving anime images. Restore clarity and bring your favorite anime to life. Try it now!
Get Accurate Answers On Any Topic With ThinkAny AI Search Engine
An AI-powered search assistant that understands your queries and delivers accurate, relevant, high-quality answers.
Accurate Audio-to-Text Conversion with Skeleton Fingers AI Transcription
A free online AI tool that accurately transcribes audio from URLs, files, or recordings into text.
Generate High-quality PNG Images From Your Ideas – PNGMaker
Say goodbye to complex editing. PNGMaker delivers your perfect PNG image from just a description. Experience it now!
iPhone 15 Website
Recreate the Apple iPhone 15 Pro website, combining GSAP animations and Three.js 3D effects. From custom animations to animated 3D models, this tutorial covers it all.
Universal icons kit
A set of 84 vector icons for web & app design.
[Download]
Cartoon Avatars
[Download]
