Styling Forms, Cards, and Navbars - opinions/helpful tips please :)
With or without a framework/lib, can y'all please help a newb out with some styling on these specific components, as I'm getting nowhere 😅
Can use my portfolio as an example of my current attempts at all 3.
https://callum-laing.com/
19 Replies
You're trying to make it way too fancy
Common beginner mistake
Try giving your cards a white background, a small amount of border radius, and a box shadow
Instead of using serif try sans-serif for the cards
And make the page background white
(would it be easier going darkmode?), by page background white, you mean the body? I thought the gradient made it look less.. dull..
I always found dark mode a bit challenging but you can try it. And yea it is more dull but it's better to have something dull at first and then you can build on top of it (as a base) imo
quick example of the darkmode I mean, gradient still, no pattern though (havent cahnged anything else, just showing the color)
Think about what content you want to add, get an idea of what order you want your cotent to be in, then create some quick wireframes with a few different varations in the layout / way you present the content, get the base stuff right (typography, spacing, hierarchy, etc.) then add on with gradients and stuff like that
so I think my biggest issue is trying to fill the hero section.. once I figure that out, the rest I'll be able to flow nicely from it
Do you really need a hero section?
Or is it more like an about section with an image of yourself?
Idc about the image even tbh mate, I put the image there because I had no idea what else to put there lol
Then just do all text for now and put in images after. Go into figma instead of wasting your time devving it
There's a lot to be said about a site that gets typography, spacing, and hierarchy correct
on figma now! what about something like...
I still think you're trying a bit too hard but that's just me ig
I was in your same position like 3 years ago trying to create something out of the box and it did not come out well at all
Then I decided to just start doing basic stuff and I started learning from there
I get that
haha, I see
anyway, I'll keep messing with figma and see what I can come up with I s'pose
the feedback i always get was "it's very empty"
so I'm a little paranoid about that now
Emptiness can be okay, you don't have to always fill in the whitespace. Another common beginner mistake is to always want to fill the negative / whitespace with stuff
just fucking with gradients here
