DEV Community

Cover image for 💪Become a Front-end Master using these awesome tools 🖱
LeafKn
LeafKn

Posted on

💪Become a Front-end Master using these awesome tools 🖱

Front-end development refers to developing the part of a computer system or application with which the user interacts directly.
If you are a front-end developer, full-stack developer, aspiring front-end developer or a creature that can breathe and read this -- this post is for you!


Got seatbelts? Let's go

1. Coolers

Provide you a color scheme generator along with many awesome trending color schemes!

coolers

2. ColorBox

Lets you create your own color scheme with a whole variety of tools!

colobox

3. Adobe Color

Spin around the color wheel, know more about colors through playing with them along with many insanely nice color schemes available at one search!

adobe

4. Wordmark

Type in your sentence/word and scroll to see how it will look in web safe fonts!

wordmark

5. PNGtoSVG

Simply convert your png to svg and use it in your projects.

pngtosvg

6. CSS3 Generator

Provides perfect CSS3 code that works on every browser!

css3gen

7. CSS Filters

Apply filters using the tools and use what please you.

cssfilters

8. Fancy Border Generator

Bored of those basic border radius things, here create fancy-fancy borders for your divs or buttons or any element you like!

fancy-border

9. Blob Maker

Blobs.. makes your website look so blobby and cute. Create them with this awesome tool and have blobby fun.

blobmaker

10. Blob Maker 2

One more blob creator. This one is pretty cool too! I use both ;)

blob

11. Get Waves

Create wavy wavy website using this great tool.

getwaves

12. Clippy

The best clipping tool I use most. Helps create really nice clip paths!

clippy


Hope this helps you! See you around!

gif

Top comments (37)

Collapse
 
timhuang profile image
Timothy Huang

Cool tools. Thanks for sharing.

Collapse
 
paganbuck profile image
Paganbuck

Great, thanks a lot

Collapse
 
faridsa profile image
farid

I didn't knew many of these sites, thanks for sharing!

Collapse
 
azooz2014 profile image
Azooz

Thanks🙏🏻

Collapse
 
phyesix profile image
Ibrahim Nergiz

Thank you 🔥

Collapse
 
stranothus profile image
Quinn Gibson

This is probably part of why you're so awesome at frontend. I'll look into these tools while designing future projects for sure!

Collapse
 
leob profile image
leob

Well, it's not the tool that makes the craftsman, but a good craftsman does know how to choose the right tool for a task ;)

Collapse
 
knaagar profile image
LeafKn

Me.... awesome at frontend! Thank you thank you :)

Collapse
 
khulyso12 profile image
khulyso-Dev®🇿🇦

So useful especially for beginners, thanks for sharing.

Collapse
 
knaagar profile image
LeafKn

Thank you!

Collapse
 
ajitkumar1264 profile image
vaghela Ajitkumar

Amazing tools it is 👍

Collapse
 
j__tim profile image
Jon Snow

Awesome

Collapse
 
alan5151 profile image
Alan Carvalho

Tks...

Collapse
 
whereismysoft profile image
whereismysoft

Tanks a lot!
This post should updates with a new tools if possible

Collapse
 
knaagar profile image
LeafKn

I will surely try to add more tools :)

Collapse
 
ikurosaki profile image
ikurosaki

Excelente aporte, Gracias.

Collapse
 
joeblackish profile image
JoeBlackish

Thanks man, i'm going to rock these awesome tools.

Collapse
 
knaagar profile image
LeafKn

Your welcome!

Collapse
 
robsonmuniz16 profile image
Robson Muniz

Great Content, thanks for sharing it!

Collapse
 
knaagar profile image
LeafKn

Glad you like it :)

Collapse
 
liviufromendtest profile image
Liviu Lupei

For obvious reasons, I would also recommend Endtest.
Can be used to quickly create some automated tests and have them running automatically on all browsers.