loading...
Cover image for Revamp your profile's color scheme!

Revamp your profile's color scheme!

reiallenramos profile image Rei Allen Ramos ・1 min read

Hey awesome devs! 👋 As a side-project, I created this app to seamlessly browse color palettes for your account! If that's not your thing, you can also enter a username and scrape their profile to identify which colors they use.

But why?

From a user point-of-view, I feel the color pickers in the profile settings aren't as intuitive as they can be (not all of us are gifted in color theory 😕). However if you have available hex values then good for you!

From a developer point-of-view, this is a part of my journey in learning Python. The frontend was fairly easily done with VueJS, but on the backend side I got to learn about web scraping with BeautifulSoup4. As a bonus, I also learned how to deploy images in Google Cloud Run 🌈!

Code available here.

Shoutout to Michael from yo@dev.to for responding and pointing me to the right direction when using the DEV logo! 👌

Posted on by:

reiallenramos profile

Rei Allen Ramos

@reiallenramos

Ruby/Ember dev learning to blog. Writing simple and straight-to-the-point tutorials!

Discussion

pic
Editor guide
 

Aww yeah! This is a really neat thing, and a super clean interface :) Thanks for sharing!

My color scheme, light blue and black

 

Thank you! I used Skeleton CSS to create a basic responsive layout.

 

This is so cool! I think it would be nice addition to DEV profile. We could even randomize colors for users when they join so they don't end up with generic colors! Probably one thing we could add is picking colors that pass contrast ratio because we use these colors for "Follow" button and others so it's important to keep colors accessible and readable. But I love the idea, it's great!

 

Ohhh the contrast ratio bit is very interesting! I never thought about how colors are being used to attract or divert attention. For me it was just about what looks good together. TIL!

 

Didn't work for me :/
Can't find my account..
Anyway, good initiative 🙂

 

Looks good from my end. Can you try again?

screenshot

 

It's working now 🙂
But there's a small issue, at least in Edge and Chrome for Android, the submit button doesn't get enabled if I type, only if I paste the text from the clipboard.
In Firefox Night preview for Android it works, but the button still has the disabled style.
(Ps: I'm using Android 7.1, if that might help)

 
 

It worked!! 😊 Thanks a lot!

 
 

Thanks! It means a lot :D