Add styles to text and objects

You can use the style settings to control the look and feel of 2D and 3D objects with attributes such as fonts, alignment, kerning, colors, transparencies, bevels, extrusions, and more.

  1. Open a graphic in Titler Pro.

    Tip: For details about using Titler Pro with a video editor, see one of the articles in the Add graphics to projects in your video editor section of our help center.

  2. Select an object or group of objects in the workspace or timeline.
  3. To apply predesigned styles from the library, complete the following steps.

    1. Open the Library panel.
    2. Select Styles from the drop-down list at the top of the Library panel.
    3. Double-click a collection to view style designs in that collection.
    4. To preview a style design on the selected object or group, hover the pointer over a design.
    5. To apply a design to the selected object or group, double-click a style design.
  4. To customize style attributes, click the Attributes > Object > Style tab.
  5. See the following sections to add styles.

    Customize text

    Add and customize 3D and 2D style layers

Customize text

You can change a character or paragraph's font, size, weight, alignment, kerning, position in its bounding box, and more.

Set common text options such as font, size, alignment, and more

To customize text from within the Attributes > Object > Style tab, select a character or paragraph in the workspace, then select an option in the Style tab's formatting toolbar.

style-text.png

To scale text from within the workspace, select a character or paragraph in the workspace, then click and drag the paragraph box to the desired size.

Back to list of styles

Set kerning

You can adjust the amount of horizontal and vertical space between individual characters, lines of text, and objects. Complete one of the following steps.

To adjust kerning from within the Attributes > Object > Style tab, select a character, paragraph, or object in the workspace or timeline, then enter new values in the Style tab's kerning adjustment style-kerning.png fields.

To adjust the kerning between characters from within in the workspace, double-click a paragraph, select one or more characters in a paragraph, and either move the borders of the blue bounding box or press ALT + up or down arrow keys.

style-kerning-characters.png

Back to list of styles

Fit text

You can choose how text behaves in relation to its bounding box, which can help you create reusable designs that have a consistent appearance.

Select a paragraph in the workspace or timeline, then select one of the following options from the Style tab's Fit Mode style-text-fit.png drop-down list.

  • Fit Box to Text: The bounding box's size changes as the font size increases or decreases.
  • Fit Text to Box: Text scales to fit inside the bounding box. You can increase the box size to allow text to expand.
  • Fit Text to Box Width: Text scales to fit the width of the bounding box. This is useful for lists and credit rolls.
  • Cut Text to Box: Text is limited to the size of the bounding box. This option ensures text fits within the intended design.

Back to list of styles

Add and customize 3D and 2D style layers

You can add 2D or 3D attributes to objects and apply colors, gradients, and other properties. You can also extrude and bevel 3D style layers and add shadows, blurs, and outlines to 2D style layers.

Add 3D and 2D style layers

Select an object in the workspace or timeline, then select one of the following options from the Style Layer style-layer-list.png drop-down list in the Attributes > Object > Style tab.

  • 3D Outline: Creates an outline around text with 3D properties like extrusion and beveling.
  • 3D Face: Creates a new 3D face of text with 3D properties like extrusion and beveling.
  • 3D Gloss Face: Creates a new 3D face with a preset gloss gradient and 3D properties like extrusion and beveling.
  • 2D Shadow: Creates a 2D shadow on text with 2D properties like color, gradient, and opacity.
  • 2D Outline Glow: Creates a 2D glow around text with 2D properties like color, gradient,and opacity.
  • 2D Blurred Face: Creates a colored 2D blur on text with 2D properties like color, gradient, and opacity.

style-layers.png

When you add a 3D style layer, the new settings appear in two sections of the Style tab.

  • 3D Outline, 3D Face, or 3D Gloss Face section — One of these sections appears, depending on the type of layer you select, and is where you can change colors and gradients, map videos, enable variables (as described in Create variables in designs), control transparency, offset objects, set layer depth, and set width.
  • 3D Controls section — This section is where you can set depth, bevels, and shine which allow you to transform graphics into 3D.

When you add a 2D style layer, the new settings appear in either a Face, Outline, or Shadow section of the Style tab, depending on the type of layer you select.

Many 2D settings are the same as 3D settings, but some settings are exclusive to 3D or 2D style layers. For example, you can't extrude 2D layers like you can 3D layers.

Back to list of styles

Add color

Use the Color style to change the color of text or objects.

  1. Select the Color option in a style layer section of the Attributes > Object > Style tab.
  2. Click the color swatch.
  3. In the Pick Color dialog, complete any of the following steps to select a color.
    • Click a color on the wheel.
    • Click Hex or Dec, then enter the desired Hex or Dec values.
    • Click the color picker btn-color-picker.png, then click a color on your screen. (Press ESC to cancel the color picker.)
    • Click and drag the horizontal sliders to adjust the selected color's hue and opacity.

Tip: Want to create a color variable? See Create variables in designs for details.

Back to list of styles

Add gradients

Use the Gradient style to customize text or objects with gradients based on multiple colors.

  1. Select the Gradient option in a style layer section of the Attributes > Object > Style tab.
  2. Click the color swatch.
  3. In the Color section of the Pick Color dialog, complete any of the following steps to select a color.
    • Click a color on the wheel.
    • Click Hex or Dec, then enter the desired Hex or Dec values.
    • Click the color picker btn-color-picker-gradient.png, then click a color on your screen. (Press ESC to cancel the color picker.)
    • Click and drag the horizontal sliders to adjust the selected color's hue and opacity.
  4. In the Gradient section, select the number of colors to include in the gradient and the type of gradient from the two drop-down list.

    style-pick-color-gradient.png

  5. In the gradient color wheel, click and drag each large circle to adjust the gradient's color range, then click and drag the small circles to adjust the transition point between colors.

Tip: Want to create a gradient variable? See Create variables in designs for details.

Back to list of styles

Add images and pre-recorded videos

Use the Image/Video setting to add an image, such as a texture, or a pre-recorded video to text or objects.

  1. Select the Image/Video option in the style layer section of the Attributes > Object > Style tab.
  2. In the dialog that opens, select an image or video from your computer and click Open. The image appears in the object or, if applicable, in each character in a paragraph.
  3. To map the whole image or video to an entire paragraph (as opposed to repeating the image in each character of a paragraph), mark the Stretch to Paragraph checkbox.

    style-image-map.png

Tip: Want to create an image or video variable? See Create variables in designs for details.

Back to list of styles

Trim videos

Use the Video Trimmer to select and play a specific portion of a video in your graphic.

  1. Add a pre-recorded video as described in the previous section, if you haven't already done so.
  2. Right-click (Windows) or Control + click (Mac) on the video swatch in the style layer section of the Attributes > Object > Style tab and choose Trim Video.
  3. In the Video Trimmer, slide the playhead to the where you want to video to start, then click the Mark In btn-style-video-trimmer-mark-in.png button.

    style-video-trimmer.png

  4. Slide the playhead to the where you want to video to end, then click the Mark Out btn-style-video-trimmer-mark-out.png button.
  5. If you want the video to loop, mark the Loop Video checkbox.
  6. Click OK.

Back to list of styles

Set transparency

Use the Opacity setting to determine if or how much you can see through a layer.

Click the Opacity slider or arrows in a style layer section of the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Offset an object

Use the Offset setting to adjust a layer’s center axis.

Click the Offset slider or arrows in a style layer section of the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Set depth

Use the Layer Depth setting to adjust the depth of a layer in relation to its position in 3D space.

Click the Layer Depth slider or arrows in a style layer section of the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Set width

Use the Width setting to adjust the width of a layer.

Click the Width slider or arrows in a style layer section of the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Extrude an object (3D styles only)

Use the Extrusion setting to add depth to an object and make it appear three dimensional.

Click the Extrusion slider or arrows in a style layer section of the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Add shine (3D styles only)

Use the Shininess setting to change the amount of a layer’s reflection as it interacts with a light source.

Click the Shininess slider or arrows in the 3D Controls section of a style layer, in the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Map images or videos to sides (3D styles only)

Use the Map to Sides setting to map the selected image or video to the side of an extruded object.

Click the Map to Sides checkbox in the 3D Controls section of a style layer, in the Attributes > Object > Style tab.

Back to list of styles

Create a reflective surface (3D styles only)

Use the Environment Map setting to create a reflective surface in an object that reflects the selected image or video.

Click the Environment Map checkbox in the 3D Controls section of a style layer, in the Attributes > Object > Style tab.

Back to list of styles

Bevel an object (3D styles only)

Use these beveling settings to create 3D effects.

Adjust any of the following settings in the 3D Controls section of a style layer, in the Attributes > Object > Style tab.

  • Click the Bevel Size slider or arrows, or double-click the value and enter a new value, to adjust the amount of beveling.
  • Click a Bevel tile or click and drag the points in the bevel grid to customize the beveling.
  • Click the Include Back Side checkbox to bevel an object's backside.

Back to list of styles

Add texture

Use the Normal Map Surface setting to add texture that reacts to light.

Click the Normal Map Surface button in a 2D style layer section or the 3D Controls section of a 3D style layer, in the Attributes > Object > Style tab, then double-click a texture in the window.

Tip: Hover the pointer over a texture in the library to preview the texture in the layer.

Back to list of styles

Set blur (2D styles only)

Use the Blur setting to adjust the focus of an object. A blur value of 0 is sharp and crisp, and a value of 100 is soft and out of focus.

Click the Blur slider or arrows in a 2D style layer section of the Attributes > Object > Style tab, or double-click the value and enter a new value.

Back to list of styles

Add an effect (2D styles only)

Use the Add Effect setting to apply animations, filters, and other 2D effects to a layer.

Click the Add Effect button in a 2D style layer section of the Attributes > Object > Style tab, then double-click an effect from the Effects library. Additional settings appear for the selected effect.

Tip: Hover the pointer over an effect in the library to preview the effect in the layer.

Back to list of styles

Was this article helpful?
1 out of 1 found this helpful
Have more questions? Submit a request