Weekly Web Design & Development News: Collective #527
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 46, 2023).
Web Design & Development News: Collective #527
draw-a-ui
An app that uses tldraw and the gpt-4-vision api to generate html based on a wireframe you draw. This works by just taking the current canvas SVG, converting it to a PNG, and sending that png to gpt-4-vision with instructions to return a single html file with tailwind.
uint8array-extras
Useful utilities for working with Uint8Array (and Buffer)
[Download]
htmlbook2pdf
A JavaScript library converts GitBook to a PDF book.
Butterup
A lightweight JavaScript notification library that adds modern, smooth, customizable, non-intrusive toast notifications to your website.
Svelte animation library
A simple Svelte animation library. Instead of being limited to animating CSS properties using a JavaScript animation library, or the Web Animations API, it uses values that change over time, to animate any property.
WASM AI
Vercel and web-llm template to run wasm models directly in the browser.
AI Starter Kit
A Web app stack written in FastAPI, Qdrant, and React for creating AI projects
[Download]
Email Validation In JavaScript
Email Validation in HTML CSS & JavaScript.
Database Backup
A Node.js application that performs automatic backups of a MySQL database using the mysqldump command. The backups are saved as SQL files in a "backups" folder.
[Download]
Email Masker Browser Extension
An open-source browser extension that helps you generate and use masked email addresses for your online accounts using Skiff Quick Aliases. It helps you protect your privacy and keep your inbox clean from spam.
[Download]
HomeHunter Free Website Landing Page Template
A free, open-source website landing page styled using Tailwindcss with GSAP animations.
Segmented Pixel Tooltip Animation
A minimalist CSS framework designed for simplicity and ease of use.
Responsive Slider with Scrollbar | Swiper & Glassmorphism
See the Pen Responsive Slider with Scrollbar | Swiper & Glassmorphism by Ecem Gokdogan (@ecemgo) on CodePen.
Text effects
See the Pen Text effects by Kass (@kassandrasanch) on CodePen.
Geist Sans Font Breathing
See the Pen Geist Sans Font Breathing by John Pham (@JohnPhamous) on CodePen.
Pure CSS: Scroll-driven Animations (Responsive Webpage)
See the Pen Pure CSS: Scroll-driven Animations (Responsive Webpage) by Andrej Sharapov (@andrejsharapov) on CodePen.
Photo Zoom iOS zoom effect, Image Flip and Capture Effect
See the Pen Photo Zoom - Codepen Challenge - iOS zoom effect, Image Flip and Capture Effect by Ismail Vittal (@ismailvtl) on CodePen.
AI Weekly Digest Issue #31
Get your AI update with AI Weekly Digest Issue #31 for Week 46 of 2023. A curated selection of the most impactful AI news and events worldwide.
[Download]
Bulk Transcribe YouTube Videos into Structured Text with AI and Python
Use this Python script to automate transcription of YouTube videos and playlists using Python, Whisper and CUDA acceleration.
Get Instant Article Summaries with SMRY.ai. Breakthrough Paywalls And Streamline Reading
Break through paywalls and access knowledge with SMRY.ai. Fast, free article summaries await.
Monaspace
The Monaspace type system is a monospaced type superfamily with some modern tricks up its sleeve. It consists of five variable axis typefaces. Each one has a distinct voice, but they are all metrics-compatible with one another, allowing you to mix and match them for a more expressive typographical palette.
[Download]
Cyber Security Web Design
Cyber Security Web Design in Figma.
[Download]
