CREATE BUTTON FROM SCRATCH
CREATE BUTTON FROM TEMPLATE
VISIT OUR FORUM

This flexible, powerful tool gives you everything you need to easily create highly customizable beautiful buttons for your web page.
There are button setting templates shared to other users at our forum.


CREATE BUTTON FROM SCRATCH

 
layer 1 text on button:
 
    RESET ALL SETTINGS
 
text size (font size):
text style (font face): preview all fonts...
 
text align: center      
text offset (horizontal) X: pixel.
text offset (vertical) Y: pixel.
 
text opacity: percent.
text color:
 
button style: please click to select a button style...
overlay button with color:       yes       no
button flip (horizontal) X: yes       no
button visible: yes       no (button not shown!)
 
button hover/ on-mouse-over effect: yes       no
hover effect: brightness
 
background image color:
background image height: pixel + button height + shadow distance
background image width: pixel + button width + shadow distance
 

   IMPORTANT NOTE  
button width/height auto-adjustment: yes       no

- If you choose yes, the values specified for button height and button width below will be by-passed. Your button will be auto-adjusted it's width/height to fix the text laying on it.

- If you choose no, the values specified for button height and button width below will be used when we create your button. You'll need to manually adjust your button height/width to be sure it fix the text laying on it.

button height: pixel.
button width: pixel.
 
    RESET ALL SETTINGS
 
layer 2 button top inner shadow: yes        no
   
 
  Inner shadow style:

  Opacity: percent (not yet working).

  Overlay with color:       yes    no

  Size: pixel.

  Offset: pixel.
 
layer 3 button bottom inner shadow: yes        no
   
 
  Inner shadow style:

  Opacity: percent (not yet working).

  Overlay with color:       yes    no

  Size: pixel.

  Offset: pixel.
 
    RESET ALL SETTINGS
 
layer 4 icon style: please click to select an icon style...
overlay icon with color:       yes       no
icon opacity: percent.
icon visible: yes       no (icon not shown!)
 
icon align: left       center       right
icon size (horizontal) X: pixel.
icon size (vertical) Y: pixel.
icon offset (horizontal) X: pixel.
icon offset (vertical) Y: pixel.
  RESET ALL SETTINGS
 
text shadow: yes        no
   
  text shadow style:

simple     emboss down     emboss up

percent of dark shadow opacity.
percent of bright shadow opacity.
 
button shadow: yes        no
   
  button shadow position:
center        bottom        bottom-right


pixel of distance.
percent of opacity.

Other button shadow positions (not recommended):

top         left        right
top-left        top-right         bottom-left       

 
    RESET ALL SETTINGS
 
image file type:
image quality: [applicable to jpg image file type only]
 
trim the output image: pixel - left
pixel - top
pixel - right
pixel - bottom
 
layers rendering order: # 1 [first]
# 2 [next]
# 3 [next]
# 4 [last]
 
    RESET ALL SETTINGS
 
Your image will be rendered using all of the settings specified above.
Then, the button reflection will be appended to it- after all.

button reflection: yes        no
   
  If you turn on button reflection (by choosing yes), your background image height will be the height of itself (specified above) plus the percentage of the reflection height specified below:
 
  Height: percent.

  Opacity: pixel.

  Offset (horizontal) X: pixel.
 
    RESET ALL SETTINGS

 
TCHYT FREE ONLINE BUTTON AND ICON GENERATOR
Copyright © 2009 by TMT. All rights reserved.
button icon maker email