loading...

I see a fresh website and I want it painted black.

adam_cyclones profile image Adam Crockett ・1 min read

My portfolio website is coming on nicely, but one thing that bothers me. I swear I used to be able to design before I learned about good accessibility practices. You see I like colour, and I know of some color pallettes that aren't too bad for getting a AA or even triple AAA rating. Sounds good so far, "I could splash a little yellow here, a little blue there, oh that pink looks nice.. ". I have just broken a rule. Not too many colours!

Okay let's try this again, make the colors more muted, use 3 colors max, keep things consistent. Oh it looks like IV just made a black and white website...

I find that my websites always just end up as black and white generic box stacks. I want to use black, white, brown and copper colours. Then I need to decide how much ratio of each colour, as a big slab of brown could look like 💩.

Okay so perhaps I have a way forward, wait isn't copper the colour of 3rd place medals.. oh choosing a scheme is so hard, even with a decent pallette, making. The rules that's the hardest bit.

I have no idea how to make rules for my colours and if there is a way to look modern but break out of the generic hero image and stacks of boxy content, or if my theme should be dark or light.

Posted on by:

adam_cyclones profile

Adam Crockett

@adam_cyclones

I work at ForgeRock as Staff UI Engineer, I play with all sorts really. Lately WASM is my toy of interest.

Discussion

markdown guide
 

I wonder.

If the colors are just accents (there's that splash :D) and don't convey important information. Maybe they're just colorful borders.

This is how I feel about boxy content. boxes ... everywhere... I would love some more fluidity to layouts.

 

Perhaps that's why I don't like boxed in content anymore, maybe interesting layout is the way forward? I kind off like stuff that is off grid but somewhat still in a grid. Also movie posters are a good example of this sort of flow.

I am conscious that users read websites in F shapes so there's that too.

 

Interesting. I've been exploring this route lately and have not come across any unique inspirations. Got any links?

Maybe this?

images.app.goo.gl/Q9aCJKCuhtHAQyYK7

Diagnoal or hexigon based grid systems, that sort of thing. Something challenging.

All of these

bashooka.com/inspiration/25-unusua...

I think the trick is aspect ratio.

16:9
9:24
1:1

All nice ratios that look pleasing somehow.

 

The problem I feel we all face when trying to create a personal website for ourselves.

 

Absolutely, it's nice to put it down in words. 😀

 

This article helped me get past this feeling by providing a useful framework for using color in UI:
learnui.design/blog/color-in-ui-de...

hope that helps.

 

I just wanted to say a huge thank you, there are great posts linked to this as well.

 

Thanks Andre I will check it out tonight.

 

Well, now you've got paint it black stuck in my head.

 

"I see a red door".. damn I'm thinking about it again now too.