Single price grid component

The overall layout looks good but you've done a major problem with the colors.

The text isn't readable so try to change the colors as shown in the style guide. It will make the card look much better.

Also the very first heading "Join our Commmunity" should have a larger font-size. You should write this inside of an h2 element because this is an important heading.

To make the card look like a "card" use box-shadow property. Here is what I used:

box-shadaow: 1px 3px 15px rgba(0, 0, 0, 0.2);

Hello Coder 👋.

Congratulations on successfully completing the challenge! 🎉

Few suggestions regarding design.

➨To properly center the container.

• USING FLEXBOX

body{
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}

• USING GRID

body{
min-height: 100vh;
display: grid;
place-items: center;
}

➨ Give some width or more specific max-width to your card as it is get very large on larger screen.

➨ Use responsive units(rem, em, %) from next project. Explore respective use cases on google.

link.

➨ You can use accessibility features like aria, sr-only, and title which are accessible to screen readers.

I hope you find this helpful.

Happy coding😄