Collective #760
Inspirational Website of the Week: Bownds Ranches
Bownds Ranches is this week's pick for its bold and captivating design that features a variety of engaging layouts and interactive elements that add to the user experience.
Get inspired
This content is sponsored via BuySellAds
Use Kintone to Spend Less Time on the Back-end
Kintone is a powerful web database, providing developers with a convenient environment to test out front-end coding ideas, without having to run a backend.
Find out more
Chrome ships WebGPU
The Chrome team has announced the release of WebGPU, a new graphics API for the web that offers access to more advanced GPU features and provides first-class support for general computations on the GPU. After six years of development, this initial release of WebGPU is available on ChromeOS, macOS, and Windows with support for other platforms coming later this year. Read more about it in this thread by Corentin Wallez.
Check it out
AgentGPT
AgentGPT allows you to configure and deploy Autonomous AI agents. Name your own custom AI and have it embark on any goal imaginable. It will attempt to reach the goal by thinking of tasks to do, executing them, and learning from the results.
Check it out
A README Template
Matthias Ott has created a README template for projects that can be modified depending on the required sections for the project, and also suggests the usage of the DocToc package to automatically generate a table of contents.
Check it out
Recreating the title effect from creativesouth.com
Rachel Smith details the steps taken to recreate the mouse-aware "3D" effect on the title text of Creative South '23 website using HTML, CSS, and JavaScript.
Read it
CSS Text balancing with text-wrap:balance
Ahmad Shadeed takes a look at the new experimental "text-wrap: balance", which allows CSS text balancing by dividing words equally between two lines.
Check it out
Simple colorful logging in Node.js
This article by Stanko introduces a simple way to output information to the console in different colors in Node.js, using ANSI escape codes. The script is provided, allowing users to log things in color by using the commands.
Check it out
Codeberg
Codeberg is a nonprofit organization dedicated to providing a secure and welcoming home for the open-source code that powers our world, ensuring that free code remains free and secure in perpetuity.
Check it out
Using the Cookie Store API
Raymond Camden introduces the Cookie Store API, a new asynchronous web API designed for reading, writing, and deleting cookies in a modern way, and provides examples of how to use its methods.
Read it
Semaphore
Semaphore is a project that uses OpenCV and MediaPipe's Pose detection to detect body landmarks from video input and translate them into keys and commands sent via keyboard. It allows users to "type" letters, digits, and symbols via flag semaphore by extending both arms at various angles.
Check it out
Diagonal Layouts in 2023
Nils Binder shows how to create diagonal layouts in this demo using the newly supported trigonometric functions in CSS.
Check it out
Bored Reading
A website designed for pro-users, artists, engineers, and anyone looking for a functional, simple, and personality-filled way to browse the internet without the need to log in or deal with annoying distractions, with the option to send feature requests or add favorite blogs to the site.
Check it out
Lucia
Lucia is a user and session management library that offers a flexible and straightforward abstraction layer between your application and your database, providing an effortless and comprehensible experience.
Check it out
Deck of Cards
An updated verison of Deck of Cards, a playing cards platform, where you can play single and multiplayer card games for free.
Check it out
Choosing a name for your design system
Brad Frost discusses the importance of choosing a formal name for your design system and provides tips for how to choose and implement it effectively.
Read it
Anderson Mancini Website Hero
Anderson Mancini is sharing the code for his website hero which was surprisingly made without using 3D elements in Three.js, but rather a simple plane with a normal/displacement texture and lights that follow mouse movements.
Check it out
Tabby: Self-hosted AI coding assistant
Tabby is a self-hosted AI coding assistant, currently in alpha phase, which provides an open-source/on-prem alternative to GitHub Copilot, featuring a self-contained architecture with a web UI for configuration, OpenAPI interface, and support for consumer-level GPUs.
Check it out
Can you create beautiful stroked text in CSS?
In his article, Rob O'Leary delves into multiple methods of achieving stroked text, or outline text, using both CSS and SVGs. He provides many examples to demonstrate these approaches.
Check it out
Skeleton: UI Toolkit for Svelte & Tailwind
In case you didn't know about it yet: Skeleton is a fully featured UI toolkit for building reactive interfaces quickly using Svelte and Tailwind.
Check it out
Coursemate
A platform that allows self-learners to connect with each other based on their location, age, and interests, and set up Coursemate groups to collaborate on online courses.
Check it out
Midjourney AI Guide
An updated version of useful guides and resources for using Midjourney.
Check it out
From our blog
Grid View Switch Animation
A concept for a view switch animation from grid to slideshow.
Check it out
From Our Sponsor
Unleash Your Creative Genius with Divi
Unleash your inner creativity and build stunning websites faster than ever with Divi - the ultimate WordPress page builder. With its intuitive drag-and-drop interface, advanced design options, and lightning-fast performance, Divi empowers developers to customize client sites with ease and speed.
Try it for free for 30 days