Maplex

Get It Done

Development Resources For all developers

Free to use web dev resources in one place

Explore
Hero Image
Tools
Html
Css
Javascript
Designs
Images
Icons
Optimization
Colors
Fonts

Dev Tools

Vscode image
VS Code

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web.

sublime image
Sublime Text

Another option for code editing software also free to use.

Emmet vscode image
Emmet Cheat Sheet

Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow

Codepen image
Codepen

You can write code in the browser, and see the results of it as you build, great for testing ideas.

Html Resources

Mdn logo image
HTML5 Reference by MDN

Consider one of the best reference for html elements and html attributes.

W3c logo image
HTML Validator by W3C

Perfect tool for checking the validity of your html markup and contains no errors.

Css tricks image
HTML Entity Reference

Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow.

Html cheat image
HTML Cheat Sheet

This incredibly helpful HTML cheat sheet includes a full list of all HTML elements, along with descriptions.

Css Resources

Mdn logo image
CSS3 Reference by MDN

As with HTML, you don't need to know every CSS property. Use this reference instead.

Caniuse image
Can I Use

For checking the browser support for front-end technologies mobile and desktop browsers.

who hate css
CSS for People Who Hate CSS

Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow.

Emmet vscode image
Css snippets

Easy to follow and well explained css codes and topics for the most common cases.

w3c logo image
CSS Validator by W3C

Check if your CSS code is valid and contains no errors. Official W3C tool.

Clippy logo image
Clippy

A small tool to help you using the new and powerful clip-path property.

Javascript Resources

Mdn logo image
JavaScript Reference by MDN

Great reference for javaScript for beginner and advance developer.

Mdn logo image
JavaScript Precedence Table

Cheatsheet to determine which JavaScript operators are evaluated first and the order of the operators.

github logo image
JavaScript Best Practices

Principles of Writing Consistent,reusable and Idiomatic JavaScript,

hubspot logo image
DOM Manipulation Reference

A complete DOM manipulation reference that cover a lot of the aspects.

Design inspiration

landbook logo image
Land Book

Web design gallery with hand-picked website design inspirations

one page logo image
One Page Love

A gallery of beautiful websites, sorted into multiple categories.

dribbble logo image
Dribbble

Most well-known destination to find design inspiration

awwwards logo image
Awwwards

The awards of design, creativity and innovation on the internet.

Image Stack

pexels logo image
Pexels

The best free stock photos, royalty free images & videos shared by creators.

unsplash logo image
Unsplash

One of the greatest free image resources with high-resolution.

pixabay logo image
Pixabay

Stunning free images & royalty free stock Over 2.6 million+ high quality stock images.

isorepublic logo image
ISO Republic

Thousands of Free High-Resolution Stock CC0 Images and Videos.

uifaces logo image
UI Faces

Avatar photos, perfect for mockups or placeholders, try it in your next project

Icons Resources

heroicons logo image
Hero Icons

Beautiful hand-crafted SVG icons, supporting both solid and outline icons.

ionicons logo image
Ionicons

Premium designed icons for use in web, iOS, Android, and desktop apps.

fontawesome logo image
Fontawesome Icons

Best resources for icon, used by millions of designers, developers.

phosphoricons logo image
Phosphor Icons

A resources combine flexible icon family for interfaces, diagrams.

iconmonstr logo image
Iconmonstr

Discover 4562+ free icons in 316 collections of free icon resources.

Optimization Tools

googledev logo image
Google PageSpeed Insights

Easy tool to test your webpage for performance. similar to lighthouse in chrome.

squoosh logo image
Squoosh

Image compression tool for best performance and image optimization.

favicongenerator logo image
Favicon Generator

Favicon Generator tool that creates favicons for your website for all platforms.

googleanalytics logo image
Google Analytics

Get free insights about website traffic, visitors and conversions. A must for every website.

netlify logo image
Netlify

Modern tools and services with free hosting plans, simple workflow with high performance.

woorank logo image
Woorank

SEO review and analysis of your website to address common issues issues,

Colors Resources

tailwind logo image
Tailwind Colors

Excellent and popular set of color pallettes. Great selection of colors for all your projects.

flatuicolors logo image
Flat UI Colors

A good starting point for choosing a flat design color, with a lot of color options.

opencolor logo image
Open Color

Optimized color options and schema for UI like font, background, border and much more.

uigradients logo image
UI Gradients

Free Collection of beautiful color gradients for next gradients color selection.

coolors logo image
Coolors Contrast Checker

A tool for checking the contrast of a colors according to calculated values.

maketintsandshades logo image
Tint and Shade Generator

SEO review and analysis of your website to address common issues issues.

Fonts Resources

googlefonts logo image
Google Fonts

The #1 resource for free and easy-to-use webfonts. Has a huge library of fonts.

fontsquirrel logo image
Font Squirrel

The best, 100% free fonts for commercial use. Another well-known huge font library.

fontspace logo image
Open Color

Free downloads of legally licensed fonts that are perfect for your design projects.