Stat Preview Card Component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Asif, congratulations for your new solution!

  Your solution is almost finished and I've some tips for you:

  1.Insert the property max-width: 1110px to avoid the container to grow too much:

  .container {
      max-width: 1110px;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin: 10%;
      background-color: hsl(244, 38%, 16%);
      border-radius: 10px;
  }
  

  2.To add the exact same purple overlay effect for the image, matching the design files you can user, filter, background-blend-mode or mix-blend-mode (the best choice in my opinion). See the code below

  img {
  mix-blend-mode: multiply;
  opacity: 0.8;}
  

  👋 I hope this helps you and happy coding!

  0