Gaurav

Posted on Mar 11, 2021 • Edited on Mar 13, 2021

5 super under-rated free tools/resources I use almost every day. (As a Frontend developer)

#webdev #design #productivity #frontend

Hello everyone! Let's get straight into the list of 5 tools/resources I use almost every day as a frontend developer and UI designer. Of course, I use many more tools and resources in my creative process but these are the more underrated ones.

1. ScreenToGif

With this tool, we can record our screen and export the clip as a gif. Some of its amazing features include -

Recording a specific part of your screen with the area selector.
Recording with webcam.
Drawing on the screen while you are recording with the board feature.

Also, this tool is completely free and open-source on GitHub! Definitely worth a try.

2. Responsively

With this amazing tool or as they call it 'A web developer's browser you can see how your website will look on different devices. For example, here's what my website looks like on different devices

There are more than 40 devices you can choose from and check the responsiveness of your website. There are some glitches here and there but it works pretty great for the most part. Also, the community is constantly improving it because it is free and open-source!

3. DevDocs

Devdocs is a free resource where you can find documentation for pretty much every technology used in web development. You can download it as a PWA on your desktop or even your phone. Also, you can download documentation of your favourite technologies for offline reading.

4. Undesign

Undesign is a collection of free resources for developers and designers. The resources are divided into 45 categories like Inspiration, Colors, Gradients, Illustrations, Templates, etc. Also, you can install it as a PWA.

5. Colorsinspo

This is probably the only tool most people will need when it comes to choosing colors and color palettes for their projects. It has premade color palettes, solid colors, gradients, brand colors, etc. and you can also install it as a plugin for Adobe XD.

So these were my favorite 5 tools that I use almost every single day. If you find it useful please share this post. Thank you😀

Oldest comments (46)

Gaurav • Mar 12 '21

Sure! I will check it out. thank u😄

dummyko • Mar 12 '21

Very handy, Noice!

Gaurav • Mar 12 '21

thanku!

Martin Häusler • Mar 12 '21

Regex101 is amazing, my go-to address whenever the regex evaluator... disagrees... with my regular expressions :)

Ronaldo Peres • Mar 12 '21

Thanks for posting!!

I didn't know any of those. :|

Gaurav • Mar 12 '21

Glad this helped 😊

Vice Cônsul da URSAL • Mar 12 '21

This was of great help!
Thanks for the useful content =)

Sayan Mondal • Mar 13 '21 • Edited

One extension I really like to use as a Web Developer is Color Picker Eyedropper, this makes it really easy to pick any colour from the internet and use that hex code or rgb in your project. 🙌

Makes your palette looks nice with out of the box non-regular colours.

Gaurav • Mar 13 '21

Yes i have also used it. Its pretty good. Also,this feature is prebuilt in firefox when we inspect element.

zer0 • Mar 27 '21

I used to use this but the big browser have this built in nowadays (chrome e.g. in css Panel find any Color definition, click on the colour square and you can see this typical icon to pick any colour on the page. It even zooms in pixel wise to be very precise with the picking)

Also the url you provide does not exist