DEV Community

Cover image for 5 useful sites for FRONTEND devs
Lucas André
Lucas André

Posted on • Edited on

5 useful sites for FRONTEND devs

5 useful sites for you to use in your frontend projects and impress everyone.


Css Grid Generator.

This site allows you to visualize the layout of your grid and modify it, generating html and css that are easy to use.
Grid is basically an invisible mesh, used to align and structure elements or sections of your webpage.

Paletton.

With this website you will never have to worry again if the colors of your website match. It shows the right palettes for each color, with the right tones and also creates multiple color palettes.
Awesome.

Glassmorphism.

Give the effect of transparent or frosted glass to the elements of your page in seconds! The effect is based on background blur with transparency and uses stacked layers to show the depth and context of the interface.

Shortcurts.

This site is a treasure! It basically contains all the shortcuts of dozens of tools that you will use as a frontend developer, which involves a lot of design.

Google Fonts.

Let's close with a classic, which many of the newbies still don't know about.
Here you can find the most varied fonts to use in the text of your website, just select the font you like, paste the link in your html and use it in your css. There, beautiful typography on your website.


If you liked it, follow me on github!

Top comments (18)

Collapse
 
affan profile image
Affan007

Kindly update the links, links are redirecting to https//paletton.com/, for example

Collapse
 
devfranpr profile image
DevFranPR

I'm about to say the same thing.

Collapse
 
lucasandre profile image
Lucas André

Thanks!

Collapse
 
cklek profile image
Conrad Klek

Don’t forget patorjk.com ascii art generator 😉

Collapse
 
lucasandre profile image
Lucas André

Awesome!

Collapse
 
akashshyam profile image
Akash Shyam

The CSS grid link has updated...... update the link with grid.layoutit.com/ this.

Collapse
 
lucasandre profile image
Lucas André

Thanks, bro!!

Collapse
 
yansigit profile image
Aiden Yoon • Edited

noonnu.cc
You guys can use this website for nice fancy korean web fonts 😁 of course can be applied on english words too

Collapse
 
lucasandre profile image
Lucas André

Nice! 😉

Collapse
 
venkateshaj profile image
venkatesh-aj • Edited

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

Collapse
 
nickbarrow profile image
nickbarrow

Cmon man how you gonna make a post about front end development and not even notice every single link is broken

Collapse
 
lucasandre profile image
Lucas André

Haha, sorry. My post was originally in Portuguese, I translated it with google translator so as not to waste too much time, but I didn't notice that the markdown ended up misaligning.

Collapse
 
ossama1994 profile image
Ossama1994

thnks a lot

Collapse
 
lucasandre profile image
Lucas André

Thank you, for reading!

Collapse
 
janmoni05 profile image
Jyotishmoy Konwar

mast bro

Collapse
 
lucasandre profile image
Lucas André

😎

Collapse
 
kerrickchan profile image
Kerrick Chan

i own adobe cloud plan. which also have simlar powerful color wheel selection. color.adobe.com/create/color-wheel

Collapse
 
iamrathnak profile image
Info Comment hidden by post author - thread only accessible via permalink
Rathna Kumar K

Join me at #CCDaysOnline to attend exciting sessions on Serverless & DevOps on 24 & 25 March 2021. For registration and event details: t.co/z6oTSV1qgq

Some comments have been hidden by the post's author - find out more