Published on

Bookmarks

Starter Kits

Link Description
Ceateapp Lets you create starter apps for webpack, parcel, snowpack with various customizations

Resources

Link Description
Bookmarks.design The Best Resources For Designers In One Place
Design Notes A free resource library for product designers
UXDatabase Free Product Database with more than 600+ curated products divided in 8 categories and 47 subcategories
free-for.dev List of softwares (SaaS, PaaS, IaaS, etc.) and other offerings that have free tiers for developers
Best productHunt of 2020 Learn about the most significant projects on ProductHunt in 2020

No Code Tools

Link Description
Uneed A list of hand-picked tools for no-code developers
Quarkly Design tool for creating websites and web apps.
Overlay-tech Transform your design components from figma into clean React, Vue and HTML components.

Git

Tools for github

Link Description
Gitignore.io Generate gitignore easily
Markdown Cheatsheet Github Markdown syntax
Gitmoji An emoji guide for your commit messages
Keep a changelog A changelog is a file which contains a curated, chronologically ordered list of notable changes for each version of a project.
Simple Icons Over 1000 Free SVG icons for popular brands.

Databases

Link Description
PlanetScale The MySQL-compatible serverless database platform.
LItestream Fully-replicate database from SQLite to S3 with no pain and little cost.
RavenDB NoSQL Document Database with ACID Transactions
HarperDB Performant database with high response rates globally
MariaDB Open Source DB, fork of MySQL
QuestDB Fastest open source time series database
NocoDB Open source NoCode platform that turns any database into a smart spreadsheet

For Data Engineers

Link Description
Tinybird build realtime Data Products at scale through SQL-based API endpoints.
Tailscale Zero config VPN. Installs on any device in minutes, manages firewall rules for you, and works from anywhere.

Design Inspirations

Resources for you to find inspoiration from creative designs

Link Description
Web Design Inspiration Behance profile that contains a lot of design inspirations
Game UI Database Game UI inspirations
color.method.cc Color game to test your eyes

Headless CMS

Link Description
jamstack.org A list of headless CMS
KeyStoneJs Superpowered CMS for developers
Ghost Open source CMS
Strapi 100%JavaScript, fully customizable and developer-first
Directus Wraps your new or existing SQL database with a realtime GraphQL+REST API for developers, and an intuitive admin app
Sanity Unified content platform that powers better digital experiences
Dato cms The most complete, user-friendly and performant Headless CMS
Kirby cms The CMS that adapts to any project. Made for developers, designers, creators and clients.

Images and Videos

Resources to find images for free and tools to edit them.

Link Description
Pexels Free stock photos and videos by talented creators
Unsplash Free usable images
Pixabay High quality stock images and videos shared by community
Coverr Beautiful free stock video footage
Mixkit Awesome Stock Video Clips, Stock Music & Premiere Pro Templates
Lorem Picsum Easy to use, stylish image placeholders
Remove.bg Remove backgorund from images
Unscreen Remove background from videos and gifs
Wicked Backgrounds Create beautiful waves backgrounds

Tools

Tools

Link Description
transform.tools Transform SVG, HTML to JSX, JSON to GraphQl...
Pattern generator Tool to create unique, seamless, royalty-free patterns.
Keyframes.app Helps generate complec CSS animations
Typeform People-friendly forms and surveys
Animista Ready to use customizable CSS animations
Diffchecker Tool to compare text to find the difference between two text files
Spline.design Help create 3D models
createwithflow Create micro animations
html symbols html symbols that can be used instead of an icon pack
dig Check if your domain has propogated to all the servers

Mobile Dev Tools

Tools for mobile development

Link Description
Wormhole Browse & Control phone on PC

3D Resources

Resources to find 3D models

Link Description
Thangs Free 3D models

Typography

Resources to find fonts and help you out with typography

Link Description
Google Fonts A library of free licensed font families
Fontjoy Generate font combinations with deep learning
Type-Scale Preview and choose the right type scale for your project. Experiment with font size, scale and different web fonts.
Apple Fonts System fonts for Apple platforms in your apps
Typography guide A Five-Minute Guide to Better Typography by Pierrick Calvez
Fontesk A curated font library of the best high quality free fonts to download for commercial and personal use
BeFonts Download fonts for personal or commercial use
Font Fabric High quality retail font for free
Coding Fabric Compare various coding fonts

Colors

Websites that can help out with choosing colors for a project

Link Description
Colorsinspo Thousands of beautiful color palettes you can use it directly by one click
Colormixer Mix colors using interactive equalizers
Happy Hues Color palette inspiration with various themes
Adobe Color Create color palettes with the color wheel or image, browse thousands of color combinations from the Adobe Color community
CSS Gradient A free tool that lets you create a gradient background for websites
Colorable Test color contrast of your palette
Palettte Create, analyze and edit smooth color palettes

Prettify Code

Websites that can prettify a code snippet

Link Description
Faux Code Generator Turn code from GitHub Gist into faux code(SVG)
Carbon Create and share beautiful images of your source code.

Illustrations

Free illustrations that can be used in UI Designs, websites..

Link Description
vektors Find awesome free illustration packs for all your projects.
Humaaans A gallery of illustrations that can be mixed and matched.
Paaaterns Free collection of beautiful patterns for all vector formats
Avataaars Generate custom avatars for projects
Open Peeps Hand drawn illustration library
Scale Royalty free Vector Illustrations for Commercial Use

Cheatsheet

Link Description
CSS Flexbox Cheatsheet by FreeCodeCamp Flexbox cheatsheet by FreeCodeCamp
CSS Grid Layout Cheatsheet by FreeCodeCamp CSS Grids cheatsheet by FreeCodeCamp
CSS Flexbox Cheatsheet Sean Fioritto Flexbox cheatsheet by Sean Fioritto
CSS Flexbox Cheatsheet by css-tricks Flexbox cheatsheet by css-tricks
CSS Grid Layout Cheatsheet by css-tricks CSS Grids cheatsheet by css-tricks
CSS Flexbox by Malven CSS Flexbox cheatsheet by Malven
CSS Grid Layout by Malven CSS Grids cheatsheet by Malven
CSS Game πŸŽ‰ CSS game to learn selectors
BEM Cheatsheet Ways to naming your classes in CSS and many more...

Development environment

Link Description
VS Code Code editor by Microsoft
Sublime Text "A sophisticated text editor for code, markup and prose"
Hyper ElectronJs based command line interface
ohmyzsh Enables you to increase your efficiency in termial
Vim Adventures πŸŽ‰ Online game based on VIM's keyboard shortcuts

Chrome Extensions

Resources to find fonts and help you out with typography

Extension Description
CSS Peeper Chrome extension that lets you view CSS code of websites
Daily.Dev Chrome tab that provides programming news from various sources
Usernap Capture your screen, add feedback and do User Acceptance Tests(UAT)
ColorPick Eyedropper A zoomed eyedropper & color chooser tool that allows you to select color values from webpages.
Wappalyzer Identify web technologies used by a website
JSONView Display JSON files that comply with rfc 4627
svg-grabber A tool to quickly preview and get all the svg assets from a website.

References