Website Design System review

Hello!

Here’s my finished Website Design System project from the full-stack career-path:

github: GitHub - ryan1431/website-design-system
direct-github pages: Website Design System

Learned a ton doing this project, and would love to hear your feedback!
– project uses HTML & CSS only

Thanks,
Ryan

2 Likes

Wow it looks great! I like how you can hover over the icon and get the various ways of coding (hex, rgb, hsl). Thank you for sharing Ryan, I can’t wait to look deeper into the coding involved in the hover elements!

1 Like

Thanks for your input & for taking the time to review this!

Just wanted to share my take on the Website Design System Challenge! I have been learning through Codecademy since October 2021 and I am enjoying learning through the various courses. Here is my Website Design System! I’ve learned so much creating this website.

Live Page

Github Code

Thanks for checking it out and happy coding :slight_smile:

1 Like

This looks so cool!!!

1 Like

I really like your live page!!! The scroll thing is awesome. Definately looking forward to seeing how you did that haha

1 Like

Thank you for your feedback Anjanique! It’s a small addition in css to make it scroll. If you don’t spot it, I’m happy to help.

I can’t wait to see & learn from your coding too :tada:

1 Like

Of course! I was actually unable to spot it, what could I look up to learn this magic trick?

Works for elements that are on the same page (like ‘back to top’)

Just add this to the bottom of your css:
html {
scroll-behavior: smooth;
}

Here’s more info about it on W3schools

There is also a way to slow down the scroll, but I couldn’t get it to work properly… research for another day.

1 Like

Awesome, I appreciate you!

1 Like

Hi Ryan,

I really like your website; great job! I also love the hover feature. Really nice design!

Warm regards always,
nicolet301

1 Like