My Frontend Tools

Get All The Frontend - Designing, Development, and UI/UX Tools You Need In One Place

Color Palette Generator / Gradient Tools

ColorSpace

Color Palettes Generator and Color Gradient Tool

Gradient to Image maker | Angry Tools

Multilayer gradient generator provides gradient with layers support, It also create PNG transparent images, base64 image code and CSS with linear and radial orientation.

Angry Tools | Web Tools

Free web tools for speed up your development

Color Hex Color Codes

Get HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names!

Code Beautify

Code Formatter, JSON Beautifier, XML Viewer, Hex Converters and more...

HTML Color Picker

Create and choose thousands of shades of colors as per your requirement.

HTML Color Codes

Get HTML color codes, Hex color codes, RGB and HSL values with our color picker, color chart and HTML color names. Let's go!

CSS Gradient - Generator, Maker, and Background

As a free css gradient generator tool, this website lets you create a colorful gradient background for your website, blog, or social media profile.

CSS Text Gradient Generator

A fun little generator...this online tool will create CSS Text Gradients. If you want add a bit of color to your headings or text, then just use this generator to create the CSS code that can then be used in your webpages.

InclusiveColors: WCAG accessible color palette creator

A tool for making custom branded color palettes for web and UI design that are built from the ground up to meet WCAG contrast accessibility guidelines.

SYMBOLS / LOGOS / FONTS / ICONS / BUTTONS

HTML Symbols

Symbols or letters that are not present on your keyboard can be added to HTML using entities.

Browse Fonts - Google Fonts

Making the web more beautiful, fast, and open through great typography

UI Buttons - CSS Buttons

A collection of UI buttons for your next project

Lordicon - Access 26,700+ animated icons

Lordicon is a growing library full of carefully crafted, high-quality static and animated icons you won't find anywhere else.

Iconscout - Over 10.1 Million+ Design Assets

Curated SVGs, Vector Icons, Illustrations, 3D Graphics, and Lottie Animations.
Over 10,000+ new assets added every day. Integrated plugins, tools, editors, and more.

Flaticon - Access 17.5M+ vector icons & stickers

Download Free Icons and Stickers for your projects. Resources made by and for designers. PNG, SVG, EPS, PSD and CSS formats.

Iconify Design - Home of open source icon sets

All popular icon sets, one framework.
Over 200,000 open source vector icons.

Material Symbols & Icons - Google Fonts

Material Symbols are the newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants.

TinyPNG - Compress WebP, PNG and JPEG images intelligently

Smart WebP, PNG and JPEG Compression for Faster Websites

Documentation / Tutorials / Templates

DevDocs API Documentation

Fast, offline, and free documentation browser for developers. Search 100+ docs in one web app: HTML, CSS, JavaScript, PHP, Ruby, Python, Go, C, C++…

Learn HTML - Free Interactive HTML Tutorial

Learn HTML provides an interactive tutorial that explains how to build HTML & CSS websites step by step.

W3Schools Online Web Tutorials

Learn to Code with the world's largest web developer site.

Learn Bootstrap 5 - W3Schools W3Schools Online Web Tutorials

Bootstrap 5 is the newest version of Bootstrap, which is the most popular HTML, CSS, and JS library in the world for developing responsive, mobile-first projects on the web.

Learn to Code HTML & CSS

Learn to Code HTML & CSS is a simple and comprehensive guide dedicated to helping beginners learn HTML and CSS. Outlining the fundamentals, this guide works through all common elements of front-end design and development.

HTML Reference

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

Web technology for developers | MDN

The open Web presents incredible opportunities for developers. To take full advantage of these technologies, you need to know how to use them.

Search Engine Optimization (SEO) Starter Guide | Google Search Central

Learn the basics of SEO and how to implement best practices into your site.

Material Design - Learn About Great Design

Material 3 is the latest version of Google's open-source design system. Design and build beautiful, usable products with Material 3.

Magic UI - UI library for Design Engineers

50+ free and open-source animated components built with React, Typescript, Tailwind CSS, and Framer Motion.
Perfect companion for shadcn/ui.

Frontend interview preparation

The great way to prepare for Front End Interviews | GreatFrontEnd

The great way to prepare for front end interviews. 200+ of the most important questions — from building user interfaces in popular front end frameworks to system design.

Front End Interview Handbook for Busy Engineers

Front end interview preparation resources for busy engineers - quiz questions, JavaScript coding questions, algorithms questions, front end system design questions and more.

TUF+ | Best DSA Course Ever

Elevate Your Learning Journey with TUF+ Course.
Curated learning, approach-wise solutions, personalized roadmaps, expert doubt assistance, and more!

Blogs / Books / Courses

HTML & CSS Guidebook

A free interactive guide to front-end web development for absolute beginners.

CSS-Tricks - A Website About Making Websites

CSS-Tricks is a website about making websites. It's a collection of tips, tricks, and techniques for building websites.

Josh Collinsworth's Blog - Amazing blog for web developers

Josh Collinsworth's Blog - Amazing blog for web developers

for building websites.

Html Color Codes - Best Color Palette Generators

Selecting a color scheme is a critical part of any website or project, and to help you discover that perfect color combination here's compiled a list of the best color palette generators and web tools out there today.

CSS Working Group Editor Drafts (CSS docs)

CSS Working Group Editor Drafts

Free Programming Books - Goalkicker

Programming Notes for Professionals books

Web colors - Wikipedia

Web colors are colors used in displaying web pages on the World Wide Web. Know more...

RGB Color - HTML and CSS Guide

WChoosing the right color for your web design project is a serious endeavour. A color scheme can often make or break a site's overall appearance.

The Hexadecimal Number System Explained

Hexadecimal numbers, often shortened to “hex numbers” or “hex”, are numbers represented in base 16 as opposed to base 10 that we use for everyday arithmetic and counting.

The Complete Web Design Course ™ [No prior experience required]

The best resource to learn web design skills and the web design business.
100% Beginner Friendly. No prior experience required.
Taught by someone who actually makes a living selling web design and not some academic college professor who've never sold a website before.

That XOR Trick

Learn the XOR Trick to solve problems in JavaScript, C++, and more.

Sports Programming in Practice by Bartosz Kostka (PDF)

A book about competitive programming, with a focus on algorithms and data structures.

Geogebra - Free Online Geometric Tool

Geogebra is the best online geometry software for creating different geometric figures - points, lines, angles, triangles, polygons, circles, elipses, 3D planes, pyramids, cones, spheres....

How to Use WordPress with AI Tools | FreeCodeCamp

This course is designed to take you from a complete beginner to a confident WordPress user.

Pattersns.dev - Improve how you architect webapps

Patterns.dev is a free online resource on design, rendering, and performance patterns for building powerful web apps with vanilla JavaScript or modern frameworks.

Freedium - Read Medium Articles for Free

Freedium is a free online tool that allows you to read Medium articles without the need to sign up for a Medium subscription.

CSS @property and the New Style

The @property at-rule recently gained support across all modern browsers, unlocking the ability to explicitly define a syntax, initial value, and inheritance for CSS custom properties...

Building Your Color Palette - Refactoring UI

You can't build anything with five hex codes. To build something real, you need a much more comprehensive set of colors to choose from.