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

Three colums card React + TailwindCss

#react#tailwind-css

@julianv97

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

nerometa 250

@nerometa

Posted

Hmm, looks like your colors are a bit off. But don't worry, it's pretty easy for you to do and I know you can do it.

in your tailwind.config.js file, you can add custom colors from the style guide that's been provided with the challenge like this:

theme: { extend: { colors: { "custom-color": "#FF0000" } } }

and to use it as a utility class, you can then do bg-custom-color or text-custom-color since you've put your color in your config file, Tailwind will know.

Also, good work! I wanna see you improve this!

0

@julianv97

Posted

@nerometa thank for the advice, definitely changing the colors!

1
nerometa 250

@nerometa

Posted

@julianv97 Hope it's working!

Also, you can set your max-width to 60% with your Tailwind since w-4/5 is too wide. A padding of 2.5rem to 3rem should look nicer on each column.

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