skip to Main Content

I am a UI developer. My question is suppose I have provided an image from client, now with this image is it possible to detect its CSS properties that is what is the font size used in a particular area, what is the color, width, margin, padding etc through some software or tools like adobe Photoshop etc.

If yes can I get some link or tutorials of how to do that .

Any help is appreciable .

Thanks !!!

2

Answers


  1. If you are looking to detect css properties in chrome right click on the element you wish to see the css properties of, then go to inspect, you will see all the css styles associated with that element on the right side of the developer tools window that opens. Personal tip, click the computer tab on the right of styles to get an easy overview of what is actually rendered.

    for a tutorial check out https://developer.chrome.com/devtools

    Login or Signup to reply.
  2. You can use Photoshop’s ruler and guides (Gimp can also do that) to measure things like width and margin.

    As for font size I would just create a text layer in Photoshop, position it above the text in the image and eyeball it for size.

    EDIT: As requested here are a few useful links:

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search