Frontend design tools/ UI Design tools

Hi!

Everytime I start a new project I google for a html + css template that more and less fits into the category I am trying to develope for. Sometimes it would be much easier to sytle buttons, forms, text etc. with some kind of drag and drop editor that automatically generates css and html code. I am sure there are many out there but I personally have not tried any. Could you recommend me some of the best? preferably free. Thanks!

If you are using google to find free templates it will make you a copy paster not a coder. To Develop something good you must have a knowledge of HTML, CSS, Javascript. But still if you want drag and drop there are some sites like: Weebly, Wix… these are free. I will recommend to develop code by your own.

1 Like

I wouldn’t say it would make you a copy & paster as long as you understand everything that is going on. However, if you did understand everything you might as well make the templates yourself and fall back on them when needed.


Not free but Paul Irish thinks it’s good. The best recommendation evar.

I agree that being a copy paster is a bad practice. But I believe that we should use tools that makes our lives easier. Best programmers are known to be lazy but thats a good thing since they always find smart ways to do more work in less time. I would personally prefer to choose a color from a palette, border width, shapes etc and then have a css generated (as long as i know what is going on in the code) instead of going through the process of typing hundres of lines which is also more prone to errors.

yes it is a very good advice

List of few Frontend design tools/ UI Design tools

  1. InVision
  2. Zeplin
  3. Balsamiq
  4. Sketch
  5. Figma
  6. Flinto
  7. Adobe XD

This is just a handful of tools that a UI designer might work with. When choosing your tools, there are certain things to take into consideration. First of all, what kinds of projects will you focus on? Do you need tools that are suitable for designing websites, mobile apps, or both? Of course, you also need to make sure that the tools you choose are compatible with the laptop or system with which you’re working.