Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Built with mostly css grid

#sass/scss

@SiR-PENt

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Added a lil bit of functionality on this, with the dark mode. Will appreciate feedbacks.

Community feedback

Travolgi 🍕 31,480

@denielden

Posted

Hi olasunkanmi, Great job!!

You have added a nice feature. Some graphic design tips:

  • increases the contrast between the colors for the background and titles especially in the dark mode
  • try using the css transition property to make changing the theme more pleasant

Overall you did well, keep it up! And Happy coding!

Marked as helpful

1
Naveen Gumaste 10,480

@NaveenGumaste

Posted

Hay ! Good Job you made it look nearly perfect to the preview

These below mentioned tricks will help you remove any Accessibility Issues

-> Add Main tag after body like it should be your container

-> For 1st heading or h1 tag, use header tag and then inside the header put your h1 or h2 etc

-> But use header tag only once in main heading element.

-> Always use h1 first and then h2, h3 and so on

Keep up the good work!

Marked as helpful

1

@adityas24

Posted

Good job with grids buddy!

Biggest problem with your web page is accessiblity. Color of your text and headings is very light. Make them bit darker so that they are accessible to everyone. They might be inaccessible to person with weak eyesight. Many other factors come under accessiblity. Google about accessiblity in web dev and you will get more insight into this.

And here i am sharing a great tool to know that color contrast is good or bad and how readable/accessible is your text: https://coolors.co/contrast-checker/112a46-acc8e5

All the best 🙂👍

Marked as helpful

1

@SiR-PENt

Posted

@adityas24 thanks, will do just that. I really appreciate.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord