my-best-resources

my-best-resources

A curated set of design resources, component libraries, stock images, and tools to simplify workflows for frontend developers and designers.

Stars: 66

Visit
 screenshot

my-best-resources is a curated list of resources for web developers and designers, aimed at making their lives easier. It includes sections on design inspiration, ready-made components, stock images, artificial intelligence tools for various use cases, and other useful sources. The repository provides links and descriptions for each resource, offering a valuable collection of tools and assets for web development and design projects.

README:

The Best Resources for Web Developers and Designers (Opinionated)

A list of awesome resources to make a developer's life easier.

Check out my YouTube video where I showcase the resources listed here in action.

List of Resources

Design Inspiration

Source Link                 Description
Minimal Gallery Websites with minimalist design and convenient filtering.
Cosmos Tons of useful stuff. Unique images, interesting UI/UX, and much more.
Unsection Over 1000 web pages categorized by sections with convenient filtering.
Supahero Supahero offers the best Hero sections for web pages.
Stack Sorted A collection of the best web designs, sorted by elements.
Awwwards A place where the best websites in the world are evaluated and collected.
SaaSpo Page or section SaaS web design inspirations.

Catalog of Ready-Made Components

Components with open-source code.

Source Link                 Description
Built At Light A marketplace with links to free websites, components, and UI kits with convenient filtering (includes both paid and free templates).
Codrops One of the best open-source components. Most are written in HTML, CSS, JS.
Aceternity UI Top-notch additions for ready-made web pages. Technologies: Tailwind, Framer Motion, React.
Edil Ozi Open-source library with ready-made components for React applications. Stack: Tailwind, Framer Motion, GSAP.
Shad CN Open-source component library for creating your own library. All components can be customized to your design. Stack: Tailwind, React.
Motion Primitives Some of the best animated components using Framer Motion, Tailwind.
UI Verse A large number of ready-made UI components, updated daily. Stack: HTML, CSS/Tailwind.
Olivier Larose A motion design specialist who teaches and shares high-quality content. Stack: GSAP, Framer Motion, React.
21st dev High-quality visuals in an open-source library for React developers.
React Bitz Collection of animated, interactive & customizable React components. Stack: Gsap, Framer Motion, React, Tailwind/CSS

Stock Images

Source Link                 Description
Lummi AI AI-generated images and illustrations.
Unsplash Professional photos.
Pexels Free stock photos shared by professionals.

Don’t forget to compress images using Squoosh or similar services to optimize image size.

Artificial Intelligence for Various Use Cases

Source Link                 Description
Ideogram Image generator with a free tier.
Grok AI An alternative to ChatGPT, better for coding (in my opinion).
Leonardo AI Image generator with a free tier (refreshes daily).
Easy With AI A collection of AI tools for various use cases.

Other Useful Sources

Source Link                 Description
Wappalyzer A site to view technologies used on other websites (Web Scraping).
Jitter Video Ready-made video templates that can be customized and integrated into web applications.
Squoosh An image compression service from Google Chrome Labs.
CSS to Tailwind Convert your CSS code into Tailwind in seconds.
Relume Wireframe & layout structure generator. Boosts your design in start!

This resource will be updated in the future with the best tools, so drop a ⭐️ to keep track!

For Tasks:

Click tags to check more tools for each tasks

For Jobs:

Alternative AI tools for my-best-resources

Similar Open Source Tools

For similar tasks

For similar jobs