responsiveness done with tailwind css, Flex-Box and Grid

Hi @omarnate1, 👋

Nice work on your solution. I also use Tailwind in my projects, and I think I have a tip for you.

I find it helpful to add the fem- prefix to your color names in your tailwind.config.js file.

colors: {
  "fem-moderate-violet": "#7541c8",
  "fem-very-dark-grayish-blue": "#48556a",
  "fem-very-dark-blackish-blue": "#19212e",
  "fem-light-gray": "#cfcfcf",
  "fem-light-grayish-blue": "#ecf2f8",
},

This makes it easier when using Tailwind's IntelliSense to access the Frontend Mentor(fem) colors used in the design. So, for example, when you want to set a background color to moderate-violet. Type bg-fem and IntelliSense will list all of your custom fem colors to choose from.

I hope this is helpful. 😊