how should i implement my styleguide on my website?
got this but not sure how to add the black smoothly
24 Replies
@ἔρως
what do you think of this?
why did you ping me?
also, i said i suck at design
cuz saw you in other design things
me too💀
dude, im really really bad at this
but im ok at usability, but just ok
guess i have to wait then
please don't do this
it's against the rules (no unnecessary pings) and it's rude
just be patient
he also pinged me after i ranted about how bad i am at this 🤣
@timo The most important actions can be primary color like login or perform some action.
Secondary color can be used for actions like signup or register. You can use secondary for actions which are important in priority after main or crucial actions.
Tertiary color can be used as accent color. Actions which are not immediately important but users can perform when they want like view all
You can check this post for reference :
https://hype4.academy/learn/ux-design-tips/strong-colors
SquarePlanet
Strong colors | Ux Design Tips | SquarePlanet
When choosing the colors of design elements, take into account their hierarchy.
this is what i have rn
Since you have a black navigation bar, I would keep the links in a color which is a contrast to black so that users can see it clearly. You can pick a color that has most contrast like white or something similar to white.
You can also group your links together as they belong to the same family so that they call can be accessed in one place.
Timo's portfolio can come inside the navigation bar. I'm assuming it acts as a logo.
I would recommend building a layout first in html and then play with css because it will be easier once the layout is completed
i need touse purple so that is why for navbar and just wondering how i can implement black overall
If you are going for a dark theme or dark mode design, you can try giving your body tag black color. I'll share a inspiration with you so that you can relate or get some ideas :
https://rive.app/?ref=landingfolio
Rive - Build interactive animations that run anywhere
Use our familiar design and animation tools with our ground-breaking State Machine to create interactive motion graphics for your products, apps, sites, and games.
If you see this design, you can see how they have used the gradient or in your case the purple color in heading and rest of the site.
https://dico.app/?ref=landingfolio Here is another inspiration for you
they got like only black and then some orange for text'
I was sharing an idea when you said you wanted to implement black overall. You can try using purple instead of orange and see if it suits your layout
also, primary colors don't have to be 90% of your page. Color pallets implicitly contain black and white (or very dark and very light gray if you prefer)
in web dev, like Rozam said, primary is generally used for buttons that do something, secondary is used for less important actions, and tertiary is for accents (like those orange colors in the last example, though there's a lot of accent in that one).
That said, this is for a course, so they might mean something different by primary, secondary, and tertiary that has been explained in your lessons.
This may be true. The course may mean entirely different things 😅