wangwen1220 / supermarker

An automatic marking tool better than mark man.

中文版 README

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.