DEV Community

Cover image for Revamp your profile's color scheme!
Rei Allen Ramos
Rei Allen Ramos

Posted on

Revamp your profile's color scheme!

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! πŸ‘Œ

Top comments (13)

Collapse
 
rpalo profile image
Ryan Palo

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

My color scheme, light blue and black

Collapse
 
reiallenramos profile image
Rei Allen Ramos • Edited

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

Collapse
 
pp profile image
PaweΕ‚ Ludwiczak

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!

Collapse
 
reiallenramos profile image
Rei Allen Ramos

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!

Collapse
 
inozex profile image
Tiago Marques

Didn't work for me :/
Can't find my account..
Anyway, good initiative πŸ™‚

Collapse
 
reiallenramos profile image
Rei Allen Ramos • Edited

Looks good from my end. Can you try again?

screenshot

Collapse
 
inozex profile image
Tiago Marques • Edited

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)

Collapse
 
ben profile image
Ben Halpern

Cool!

Collapse
 
reiallenramos profile image
Rei Allen Ramos

Thanks! It means a lot :D

Collapse
 
michaeltharrington profile image
Michael Tharrington

So dang cool!

https://dev-to-uploads.s3.amazonaws.com/i/ac3mba9aee7o60ykymyi.png

Collapse
 
reiallenramos profile image
Rei Allen Ramos

It worked!! 😊 Thanks a lot!

Collapse
 
saurabhdaware profile image
Saurabh Daware 🌻

Sooo coool!

Collapse
 
reiallenramos profile image
Rei Allen Ramos

Thanks man! πŸ‘Œ