I have some ui I'd like to design. I'd like to get to the professionalism of art that is found on sites like dribbble.com. I eventually just need an image for this design I make.
I'm just wondering if I should do it with html/css (and take a screenshot) or use a vector program (my current favorite is graphic by autodesk, it works like illustrator for those that aren't familiar with it).
But what I've found difficult about designing with a vector program is let's say I'm designing a table (ie datagrid), and then I want to change the size of the rows; with a vector application I need to go and change every little vector box that makes up that grid, align the whole thing, etc.
Whereas with html I can just change the code really quick (size of rows) and see the result without as much work. So I'm just wondering for ui designers if they ran into this issue and what have they done?
From my experience, I have realized that it unless you know what exactly you want it takes a lot longer to code in HTML/CSS than a vector art software. I understand your concern about having to change repetitive components. I would suggest you have a look at some modern vector softwares like Figma, Sketch. These softwares allow you to create components and its instances. If you change the master component, all its instances would reflect that change. They even have some smart padding options.
You can achieve this using components in Figma for example but if your HTMl/CSS skills are strong enough that you feel it would be faster to build it in code then do that. The best tool is the tool you know best.
Framer X also solves this use case quite nicely but is currently in invite only beta.