Tools & Resources [Live Doc]

CSS

1. https://maketintsandshades.com/ = Tints and shade generator
2. https://bennettfeely.com/clippy/ = Clip-path Maker
3. https://coolors.co/contrast-checker/112a46-acc8e5 = Colour contrast checker

SVG Logos:

1. https://svgl.app/
2. https://www.logo.wine/ = SVG Logos
3. https://shapes.framer.website/ = SVG Shapes

Gradients:

1. https://neat.firecms.co/
2. https://www.mshr.app/
3. https://www.shadergradient.co/
4. https://color.adobe.com/ = Upload gradient image & get hex-color codes

Images:

1. https://flagpack.xyz/
2. https://undraw.co/illustrations
3. https://unsplash.com = Sample Images
4. https://uifaces.co = Sample User Face Images
5. https://extract.pics/ = Extract all images from a website

Web Performance

1. https://pagespeed.web.dev/
2. https://www.webpagetest.org/
3. https://tools.pingdom.com/

Execute JS:

1. https://runjs.app/play
2. https://jsbin.com/?html,output
3. https://codepen.io
4. https://liveweave.com/
5. https://html-css-js.com/
6. https://jsfiddle.net/
7. https://onecompiler.com/html

Icons:

1. https://hugeicons.com/
2. https://www.iconfinder.com/
3. https://tabler.io/icons
4. https://lordicon.com/
5. https://heroicons.com/
6. https://react-icons.github.io/react-icons/

Animations:

1. https://scrollrevealjs.org/
2. https://michalsnik.github.io/aos/
3. https://motion.dev/

APIs:

1. https://github.com/public-apis/public-apis = List of freely available Public APIs