DEV Community

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

Posted on • Edited on

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

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

Alt Text

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

Alt Text

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

Alt Text

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

Alt Text

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

Alt Text

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

Alt Text

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😀

Latest comments (46)

Collapse
 
alexk profile image
Alex Kaul

Another addition to the list: Freeter - a free & open source productivity tool.
Here is a story on how I boosted my productivity with it: dev.to/alexk/how-i-boosted-my-prod...

Collapse
 
venkateshaj profile image
venkatesh-aj

Hi there, I've created a color palette tool called colorsui.com. It's a free color tool.
dev-to-uploads.s3.amazonaws.com/up...

Collapse
 
devggaurav profile image
Gaurav

Nice! I will surely give it a try!

Collapse
 
venkateshaj profile image
venkatesh-aj

Hi there, I've created a color palette tool called colorsui.com. It's a free color tool.

Collapse
 
upupkenchoong profile image
Ken Choong

Tq, ScreenToGif is amazing. Love it in the first use

Collapse
 
emilienleroy profile image
Emilien Leroy

Personnaly for color palettes and gradient generator I use mycolor.space/

Collapse
 
devggaurav profile image
Gaurav

Yes its also nice. I just like the UI of the colorinspo. It's clean and minimal.

Collapse
 
chloet profile image
Chloe Tompson

Thanks for sharing, screentogif using too

Collapse
 
nykanen profile image
Jasper Nykänen

Should've Googled for ScreenToGif. I needed to record a small preview of a project I open-sourced to Github.

Instead I recorded with obs, edited the area I needed with Davinci Resolve and finally used EZGif to convert mp4 to gif.

Squoosh is also great, it supports all image formats you might need (including AVIF), helpful if you don't have a compression api / pipeline and just want to quickly optimize images.

Collapse
 
devggaurav profile image
Gaurav

Yea squoosh is amazing when it comes to optimizing the images!

Collapse
 
sivaneshs profile image
Sivanesh Shanmugam

Exactly I was searching for your option 1 the whole day. Thanks for the list 😊

Collapse
 
devggaurav profile image
Gaurav

Glad that this post helped u😊

Collapse
 
rajutes profile image
RAJU V

great content...

Collapse
 
devggaurav profile image
Gaurav

Thank u!

Some comments may only be visible to logged-in visitors. Sign in to view all comments.