kurodenjiro / logoit

Logo Image Builder

LogoIt

Logo Image Builder

Install

npm install logoit ~save

Run server

npm start

Usage

Logos are built up as a series of layers each with an increased z-index

domain/[pixels/]layer/layer2/.../layerN[.format]

• pixels: size in pixels, default 256. Same as: width:px; height:px
• layer: layer details
• format: currently only .png is supported

Examples

LogoIt

http://localhost:3000/b:yellow~gf:Lobster~f:b~tc:50~o:1~p:5~fa:photo~bc:35~p:10~LogoIt~/img.png

Invalid Image

http://localhost:3000/b:white~tc:46~p:12~fa:picture-o~bc:14~p:10~gf:Share Tech Mono~Invalid Image~tc:70~p:1~c:990000~o:0.6~fa:ban~/img.png

Not Found

http://localhost:3000/p:10~tc:60~fa:frown-o~bc:15~Not Found~/img.png

CDN All

http://localhost:3000/c:navy~ml:20~p:35~fa:level-down~tl:25~p:20~fa:cloud-download~tc:25~c:666600~p:10~fa:cloud-download~tc:20~p:34~fa:long-arrow-down~tr:25~c:006666~p:20~fa:cloud-download~mr:20~p:35~fa:level-down%20fa-flip-horizontal~bc:45~c:660000~p:8~dev:responsive~/cdnall.png

Options

• l:<language>: Set languge. default: l:en
• s:<style>: Set style. default: s:background:yellow;color:black
• b:<color>: Shorthand for s:background-color:<color>
• c:<color>: Shorthand for s:color:<color>
• o:<opacity>: Shorthand for s:opacity:<opacity>
• ff:<font-family>: Shorthand for s:font-family:<font-family>
• fw:<font-weight>: Shorthand for s:font-weight:<font-weight>
• fs:<font-style>: Shorthand for s:font-style:<font-style>
• f:<shorthand>: Special font shorthands, see: f:shorthand below
• p:<percent>: Padding, default is p:5
• <percent>%: Slide in percentage
• tl[:percent]: New Top Left layer, optional size percentage
• tc[:percent]: New Top Center layer, optional size percentage
• tr[:percent]: New Top Right layer, optional size percentage
• ml[:percent]: New Middle Left layer, optional size percentage
• mc[:percent]: New Middle Center layer, optional size percentage
• mr[:percent]: New Middle Right layer, optional size percentage
• bl[:percent]: New Bottom Left layer, optional size percentage
• bc[:percent]: New Bottom Center layer, optional size percentage
• br[:percent]: New Bottom Right layer, optional size percentage
• t:<text>: Add text to layer. ex: t:JS
• i:<src or common>: Add image to layer. Recommend square transpart .png. See Common Images for list
• fa:<name>[,name...]>: Add Font Awesome Icon to layer
• dev:<name>[,name...]>: Add Devicon to layer
• fi:<name>[,name...]>: Add Foundation Icon to layer
• flag:<country_code>: Add Flag Icon to layer
• md:<name>: Add Material Design Icon to layer
• im:<code>: Add IcoMoon icone to layer, note these require IcoMoon codes
• gf:<name>: Select Google Font. Case sensitive, ex: Logster
• i:<img_src>: Add image. Ex: i:http://domain.com/sample.png

f:shorthand

• b: fw:bold
• i: fs:italic

to include ~ in text use ~~

Common Images

Shortcut for common images, like nodejs

Click here to see a complete list

License: MIT