Weekly Web Design & Development News: Collective #510
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 29, 2023).
Web Design & Development News: Collective #510
qrcode-opencv-wechat
QR Code scanner in JavaScript, based on a WebAssembly build of OpenCV with Open CV WeChat QR Code Scanner. Provides a much better detection rate and error tolerance.
date-range-picker-for-shadcn
DateRangePicker is a reusable component built for Shadcn using beautifully designed components from Radix UI and Tailwind CSS. It provides a dropdown interface to allow users to select or enter a range of dates and includes additional options such as preset date ranges and an optional date comparison feature.
stats-gl
stats-gl is a comprehensive tool to monitor WebGL performance. The Stats class provides methods to create performance panels, log performance metrics, and manage the display and layout of these panels. The performance metrics logged include FPS, CPU, and GPU. The GPU logging is available only if the user's browser supports the WebGL 2.0 EXT_disjoint_timer_query_webgl2 extension.
GPT React Designer
With GPT React Designer you can easily get a quick preview of the React code generated by ChatGPT. Engineers can use it to draft up components and then copy it into their main code base. The code generated by GPT React Designer is styled with TailwindCSS or plain inline CSS.
cali-fm
One-click deploy your podcast website via RSS.
donut-js
Make your code look like a donut.
[Download]
mock-html
mock-html is a web server powered by Django and htmx that provides mock HTML responses for experimenting with htmx or other hypermedia libraries. It allows you to simulate server responses and test client-side rendering without the need for a real backend.
Muer
Muer is a modern, open-source music player for you and your friends.
Fabric Video Editor
Fabric Video Editor is a video editor that runs in the browser. It is built with fabric.js, Next.js (a React framework), Tailwindcss, Mobx, and typescript.
[Download]
appwrite-writer
Appwrite Writer is a Notion-style WYSIWYG editor with AI-powered autocompletions powered by Appwrite and Novel. It's goal is to give you an example of how powerful things you can build with Appwrite.
tailwindcss2css
Convert tailwindcss to css, convert tailwindcss to inline css, convert tailwindcss to native css, and enable one-click migration in Vue or React frameworks
Responsive Camping Website
Responsive Camping Website Design Using HTML CSS & JavaScript.
[Download]
Inspiration for Text Block Transitions
Some inspiration for transitioning text blocks with word and letter animations.
GSAP - Intro - Text animation / Cursor
See the Pen GSAP - Intro - Text animation / Cursor by Paul Roger (@Tiopayo) on CodePen.
Transitional Color Picker
See the Pen Transitional Color Picker by Taha Shashtari (@tahazsh) on CodePen.
Particle cursor effect - Starry Night
See the Pen Particle cursor effect - Starry Night by Dennys Dionigi (@DedaloD) on CodePen.
Fluid cursor webgl
See the Pen Fluid cursor webgl by Dennys Dionigi (@DedaloD) on CodePen.
CSS-only Slide-up Caption Hover Effect
See the Pen CSS-only Slide-up Caption Hover Effect by Mojtaba Seyedi (@seyedi) on CodePen.
AI Weekly Digest Issue #14
Get your AI update with AI Weekly Digest Issue #13 for Week 29 of 2023. A curated selection of the most impactful AI news and events worldwide.
[Download]
Detect AI-Generated Content With TypeTruth Python Library
Use AI to classify text as human or AI-generated at the paragraph & sentence level.
[View]
Fix Bugs Faster By Explaining Your Code Using AI – Whybug
Leverage AI to provide clear explanations of code errors and step-by-step recommendations to resolve bugs faster.
[View]
6 UHD Grainy Gradient Background Images
A collection of 6 UHD (3840 x 2160) grainy gradient background images (wallpapers) for adding a touch of sophistication and depth to your projects.
[Download]
mishmashmoji
A color emoji font available as both OpenType-SVG and COLRv1.
[Download]