Skip to content
Submitted 4 months ago

Accessible, mobile-first, pixel-perfect w/ HTML & CSS

haquanq ®️•1,585
@haquanq
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Fylo data storage component
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

Hello 👋

What i have done

  • Built an accessible meter component
  • Used my own judgement to achieve pixel-perfect without design files
  • Utilize clamp() and min() for better responsiveness

Any feedback would be appreciated 🙏

Community feedback

  • Lyna•60
    @djelidlynaPosted 4 months ago

    thatt is perfect bravooo, please how did you get the size of every element right like we can say its the same there is no difference wow congratss

    0
    haquanq ®️•1,585
    @haquanqPosted 4 months ago

    @djelidlyna since there was no access to design files, i was using Figma to reconstruct mostly typography to determine it's properties like line-height, letter-spacing font-size and then figure out it's relation to containers, cards, items,...

    0
    Krushna Sinnarkar•1,100
    @krushnasinnarkarPosted 4 months ago

    @haquanq

    May i know exactly how you do (in detail). I would love to learn that.

    0

Please log in to post a comment

Log in with GitHub

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