Online Gradient Image Maker with Buttons Generator
Text-It Samples Reference for Web 2.0 graphics

General Instructions
  1. All of the sample graphics images were generated in OGIM and Text-it engines.
    There is no software download or setup at your computer. Everything would be done in your browser.

    In order to open any of the sample images for editing  or create your own graphics in Text-It engine, make sure  to create a free account first, or logon to the account if already registered. (Note: Find more information about Text-It engine - graphics generator HERE)
     
  2. Follow Pat 1 of the tutorial at video tutorials page or follow brief instructions below:

     




Sample Images OGIM Ext. Images Text Layer Styles
Bravo supermarkets logo and Bravo 3D. Made with 10 layers. Reference None BRAVO-L1
thru
BRAVO-L10

OR

Bravo-3D-L1
thru
Bravo-3D-L10

Bravo Supermarkets Logo
Bravo Supermarkets Logo
C-Town supermarkets logo. Made with 10 layers. Reference None CTOWN-NEW-L1
thru
CTOWN-NEW-L10
C-Town Supermarkets Logo
New Rapid Classified Logo  300 x70 px (for RC v4.0) generated with 6 layers on a transparent background. Logo looks well on most of the backgrounds (preferably in dark shades). If you decide to create logo for particular palette/gradient background, you may paint a base image with particular solid color/gradient in OGIM before launching Text-It. Reference None Rapid-Logo-40-L1
Rapid-Logo-40-L2
Rapid-Logo-40-L3
Rapid-Logo-40-L4
Rapid-Logo-40-L5
Rapid-Logo-40-L6
Shield image made with 10 layers and requires "Add-to-Layer" image at Layer 2 (Add to Layers tutorial). Reference Add this Image to Layer 2
Layer2
Red-Shield-L1
Red-Shield-L2
Red-Shield-L3
Red-Shield-L4
Red-Shield-L5
Red-Shield-L6
Red-Shield-L7
Red-Shield-L8
Red-Shield-L9
Red-Shield-L10
New Rapid Classified Logo (from Rapid Live site) generated with 10 layers. Logo requires "Add-to-Layer" images at Layer 4 and Layer 5 (Add to Layers tutorial). Reference Add this Image to Layer 4 and Layer 5
Layer4,5
AA-rc-logo-L1
AA-rc-logo-L2
AA-rc-logo-L3
AA-rc-logo-L4
AA-rc-logo-L5
AA-rc-logo-L6
AA-rc-logo-L7
AA-rc-logo-L8
AA-rc-logo-L9
AA-rc-logo-L10
Rapid Live Logo
Rapid Classified Logo generated with 4 layers. Reference None rc-logo-L1
rc-logo-L2
rc-logo-L3
rc-logo-L4
  
Large colorful propeller icon made with 10 layers (second image has 7 layers). Reference None prop-L1-prop-L10
prop1-L1-prop1-L7
 
3D calendar buttons made with 4 layers on a flat white base image. Warp function was used to shape this button layers for proper perspective. Layers 1 and 2 use equally shaped square symbol with rounded corners. Only Layer 1 forms a light background and Layer 2 colorful banner (achieved by sliding gradient points to the top). Layer 3 is  used for a month or weekday text and Layer 4 for a date. Reference None 3D-calendar-L1
3D-calendar-L2
3D-calendar-L3
3D-calendar-L4
3D calendar Icon 3D calendar Icon 3D calendar Icon 3D calendar Icon
Similar to the above. Layers 1 and 3 use equally shaped square symbol with rounded corners. Layer 2 is an RSS symbol rendered with shifted radial gradient, stroke and a 3D shadow. When changing symbol at this layer, make sure to size and rotate it properly as well as adjust corner warp values for the best perspective in relation to the base "body". Reference None 3D-RSS-L1
3D-RSS-L2
3D-RSS-L3
3D RSS Icon 3D RSS Icon 3D RSS Icon 3D RSS Icon
Sample attractive logo was designed with 10 Text-It layers. Review layers content and change text or design. Layer 10 can be omitted. Reference None logo1-L1
logo1-L2
logo1-L3
logo1-L4
logo1-L5
logo1-L6
logo1-L7
logo1-L8
logo1-L9
logo1-L10
Mini-bar series. Generated on a thin, flat base image. Layer 1 is rendered with rectangle shape from "Mask Shapes" font, stretched by scale and warp controls. Shifted radial gradient of different colors and various hatch styles are applied here. Layer 2 creates light reflection. Layer 3 is for text. A bitmap type of font ("Astra") is selected for this layer, which allows to turn "Anti-aliasing" control OFF for the sharp text appearance. If you'd be using other fonts, make sure to turn "Anti-aliasing" - ON. Reference None Layer 1reference is next to each image.

mini-bar-L2
mini-bar-L3
  mini-bar-r-L1
  mini-bar-g-L1
  mini-bar-b-L1
  mini-bar-gr-L1
Attractive Glass buttons / logo, with warped shadow and a reflection mask from "mask shapes" font. Reference None TextIt-Glass-L1
TextIt-Glass-L2
TextIt-Glass-L3
TextIt-Glass-L4
TextIt-Glass-L5
TextIt-Glass-L6
glass image
An abstract image with newly added 3D text rendering features. Text layers utilize Shadow 3D Fill and text Warp features. Plus, couple of transparent layers for gloss reflections. Reference None 3D-Demo-L1
3D-Demo-L2
3D-Demo-L3
3D-Demo-L4
3D-Demo-L5
glass 3D image
Similar to the above. Different warp and fill values. Plus text reflection. Reference None 3D-Demo1-L1
3D-Demo1-L2
3D-Demo1-L3
3D-Demo1-L4
3D-Demo1-L5
3D demo image
Instant glass with "Auto Mask" Reference None Love-L1
Love-L2
Love-L3
Love-L4
glass heart love
Examples of raised text made with 2 Text-It layers. Raised-L1-2 Text-It styles references would build the very first image. The rest of the text styles achieved by simply applying different built-in textures  to the text face at layer 2.
Layer 1 forms a soft dark shadow and Layer 2 text face with bright edges at the top (shadow and auto-mask). In order to create this effect in any image, use the same font, size and position for both layers. Play with shadow position, auto-mask color and intensity (for top reflection), text face texture (difference scaled). A stroke could be added at Layer 2 for further highlight. Also pay attention to the combination of background (base image), shadow and text face colors (texture) on both layers as it is most important for achieving raised text effect.
Reference None Raised-L1
Raised-L2



This fine graphics was generated on a flat black background with one OGIM image added to layer 1 and utilizing all 10 available layers in Text-It. Examine layers content to see how the image was built. Add to Layers tutorial. Reference Add to Layer
Layer 1
compas-L1
compas-L2
compas-L3
compas-L4
compas-L5
compas-L6
compas-L7
compas-L8
compas-L9
compas-L10
 
glass compass button icon
Metal warning shields. Paste any text or symbol at Layers 7-10. Layer 1 is rectangle rendered with metallic texture. Layer 2 creates an inner shadow mask. Layers 3-6 are for corner screws. Reference None shield-L1
shield-L2
shield-L3
shield-L4
shield-L5
shield-L6
shield-L7

for second shield
shield-L7a
shield-L8
shield-L9
shield-L10
 
Speaker icons made with 8 Text-It layers. One OGIM image is added to Layer 1. Layer 3 is reserved for the text over the grill. Layers 5, 6, 7 and 8 are for screws. Add to Layers tutorial. Reference Add to Layer:
Layer 1

(for different center color, alter color for point 4 in OGIM)
 
loud-speaker-L1
loud-speaker-L2
loud-speaker-L3
loud-speaker-L4
loud-speaker-L5
loud-speaker-L6
loud-speaker-L7
loud-speaker-L8
 
speaker button speaker button speaker button
New York City MetroCard image generated in Text-It. Card is made with 8 layers on an orange gradient background generated in OGIM. Reference None metrocard-L1
metrocard-L2
metrocard-L3
metrocard-L4
metrocard-L5
metrocard-L6
metrocard-L7
metrocard-L8
New York City Metrocard
Display of 3D text rendering with 10 layers using various techniques with blurred and 3D fill shadows, transparent layers, texturing, warping and more... Reference None 3D-Nord-L1
3D-Nord-L2
3D-Nord-L3
3D-Nord-L4
3D-Nord-L5
3D-Nord-L6
3D-Nord-L7
3D-Nord-L8
3D-Nord-L9
3D-Nord-L10
3D text demonstration

 

 

Web 2.0 graphics. Glass buttons with 3D text rendering. Text reflection and glass surface. Gloss icons and metal icons. Online graphics generator for glossy RSS Icons. Glossy square icons and gloss button. Glass ball and gloss ball, Glow chrome buttons, Gloss shine balls, glass marbles.

8 randomly selected shared images (click on image to load it into OGIM)  All Shared Images
OGIM· OGIM Gallery· OGIM Gallery RSS· OGIM Help· RC-OGIM Templates
About Text-It· Text-It Samples· Text-It Samples (older)· Text-It Tutorials
Armenia Flags Special· Russia Flags Special· USA Flags Special· UK Flags Special· Canada Flags Special