Demonstration
中文版: Super Marker
English Version: Super Marker
Why is Super Marker
Be a Font End Development Engineer since 2012,I was deeply aware of the challenge that when you obtain the design draft from the hands of designers ,You need technical and physical strength to turn it into a web page.Imagine that if there are a lot of div on a draft design,In order to aware of the width, height, margin, pading, font-size properties,We're going to do more than 200 times measuring.If you are not very quickly, so it will take you 10 to 20 minutes.Not to mention the time taken to obtained the color of border-color, background, color and so on.So all measurements of the time will be longer than one hour.
Mark Man is slighter than Photoshop.But it still need us to enlarge the picture,Then choose the elements of the upper left and lower right corners,Thus get the size information of the elements.
Now,We have Super Marker.This is a more powerful than mark man picture information marking tool,Its strength lies in the intelligence and automation,We can automatically get the information we need.All we need to do is to move our mouse casually.
Functions
Function | Function Introduce |
---|---|
Move | If your image is too large, you can easily move the picture. |
Amplification | Because the browser itself magnifying function, this function needs to be filled on my spare time. |
Ruler | A very useful tools in this size, thanks to mark man, because I was copying its. |
Automatic line marking | Provides horizontal and vertical and reticular lines, you only need to select the regions in the image, the program will help you analyze where to draw the line. |
Color picker | You will see that something good! |
Marquee information | On your images will have a lot of lines, these lines will be divided into many sections in the picture.Through the marquee tool, can be one or a plurality of block selection (if a plurality of blocks are merged into one) information. |
Line selection tool | You can through the frame to select lines, can also activate the mode in this tool, click on the line to select it.Of course, you can also use it to cancel the choice! |
Empty | Empty all lines and boxes in the picture. |
Shortcut keys
The first letters of each word is the shortcut keys.
Move: M ove
Zoom in/out: Ctrl+(+/-)
Ruler: R uler
Automatic line marking:
- H orizen
- V ertical
- N et
Color picker: C olor
Marquee information: I nfo
Line selection tool: S elect
Delete: D elete
Empty: C lear
Licence
Licensed under MIT.