Four Card Feature Section with HTML and CSS only

Community feedback

• 

  Joseph Reyes•440

  @JreyIVPosted 8 months ago

  Hello,

  your solution looks great!

  The only thing I would recommend is to use custom variables in your code to make it easier to change them later on and so that you don't have to keep writing that hcl() stuff. Mine looked like this:

  :root {
    --ff-poppins: "Poppins", sans-serif;
  
    --fw-light: 200;
    --fw-normal: 400;
    --fw-bold: 600;
  
    --fs-normal: 0.9375rem;
  
    --clr-red: hsl(0, 78%, 62%);
    --clr-cyan: hsl(180, 62%, 55%);
    --clr-orange: hsl(34, 97%, 64%);
    --clr-blue: hsl(212, 86%, 64%);
  
    --clr-neutral-200: hsl(0, 0%, 98%);
    --clr-neutral-400: hsl(229, 6%, 66%);
    --clr-neutral-600: hsl(234, 12%, 34%);
  }
  

  I also noticed you used svg instead of image. It looks like you had to add in a lot more things like the paths and filling and stuff. Any reason for this decision?

  Marked as helpful

  0