Weekly Web Design & Development News: Collective #554

by jQueryScript,

A roundup of the latest and most popular development & design resources (Javascript & CSS libraries, Code snippets, Web Dev News & Resources, Curated AI Tools, Graphic Design Freebies, etc.)  from the past week (Week 21, 2024)

JavaScript & CSS

Restyle: The simplest way to add CSS styles to your React components.

Matcha.css: A pure CSS library designed to style HTML elements similarly to a default browser stylesheet, eliminating the need for users to manually patch their documents. Live Demo

CSSColumnPro: A powerful CSS grid layout system inspired by Bootstrap. Build responsive and customizable grid layouts with ease. Live Demo

easy-lazy: A lightweight JavaScript library for lazy loading images with various customization options. Live Demo

TypeSwift: A lightweight and typesafe code generation library built for interfacing with your Node projects using Swift.

Best Free Modal Libraries: 10 Best Free Modal Libraries For Vanilla JavaScript And CSS.


ActBot: A browser-based interaction agent script that helps users perform actions on web pages by simulating clicks and typing based on user requests.

Deneyapkart.js: A serial communication-based library that allows Deneyap Kart to be managed via computer.

he-datepicker: A tiny and easy-to-implement JavaScript library that adds a Hebrew (Jewish) date picker to your text field. Live Demo

Fix Google Web Search: This userscript removes AI results and other unwanted content from Google web searches by adding the udm=14 parameter to the search URL. This parameter switches the search to the "Web" tab, which displays only traditional web page results.

localfile.link: Remote links from browsers to open local files in users' local editor.

canvas-dimensions: A utility that provides user and screen units for a 2D Canvas.

KAPLAY: A JavaScript library that helps you make games fast and fun.

Farmup: Easy run your TypeScript or JavaScript.

Bootstrap Responsive Font Size: A flexible and maintainable stylesheet providing responsive font size utilities using CSS variables, fully compatible with Bootstrap 5 breakpoints. Live Demo

Nano Sheets: A tiny (2.5kb) javascript spreadsheet UI for modern browsers, with proper virtualization and good performance. Live Demo

Web Dev Tools & Resources

Openpanel: A simple analytics tool for logging events on web, apps and backend.

qr maker: A web application that enables users to create and share qr codes.

Firefox "On-Demand" Vertical Tabs: A Firefox setup to have "on-demand" vertical tabs using Sidebery and custom CSS.

Uptimemonster: An external web application for monitoring website and server uptime, performance, error logs and basic functions which may help you to grow your business

Usermaven: Simple yet powerful website & product analytics tool.

Graphic Design Freebies

Abstract Metallic Backgrounds: This pack includes 22 backgrounds that exude a sleek, chrome finish in full 4K quality. Each piece combines the metal texture with the fluidity of liquid in an abstract 3D form.

Abstract Metallic Backgrounds

Kabentar Modern Geometric Font: A free geometric font that combines sleek, angular shapes with flowing curve.

Kabentar Modern Geometric Font

24 Text Effects: A collection of 24 free, editable, 4K text effects in PSD format.


Curated AI Tools

Poper: AI-Driven Pop-up Builder that can convert visitors into customers,
increase subscriber count, and skyrocket sales.

CodiumAI: You get non-trivial tests suggested right inside your IDE, so you can code smart, create more value, and stay confident when you push.

Chat With PDF: Use AI to summarize, translate, and ask questions about your PDFs - all for FREE.

Shell Ask: Use Shell Ask to interact with ChatGPT, Claude, Gemini, and more directly in your terminal.

News & Articles

Angular v18 is now available. Link

Microsoft Phi-3 Cookbook: A manual on how to use the Microsoft Phi-3 family.

Modern CSS Layouts: You Might Not Need A Framework For That. Link

Rethinking Text Resizing on Web. Link