Style Border of Text Element

Business Background

Creating a text, adding a border to it, and styling them to match your business needs are seamless with Titan Web Elements. Generate a modern border text design that’s quick and easy to update with no code.

Titan Solution

  • Titan Web allows you to specify the style, width, and color of a text element’s border.
  • The border-style options specifies what kind of border design to display.
  • Add a background image to the text element or control how white spaces such as spaces, tabs, and hard returns are handled inside a text element.

How to Video

  • 0:03 Introduction on how to design a text element with multiple borders.
  • 0:10 Find your text elements easily by navigating your arrow.
  • 0:25 Add a separate border option.
  • 0:43 We show you how simple it is to modify the border around the text.
  • 1:12 Change the width of the text.
  • 1:25 Style and customize the border around the text as you wish.
  • 1:51 You can add a single or double border – even change the color of the border.
  • 2:00 Conclusion.

How to Guide

Use the following border design options to style the border of text elements.

  1. Select the expand (+) icon next to the settings icon in Titan Web. A list of elements will show.
  2. Add an element to the canvas.
  3. Select the element’s Style icon and select the Border option. 
Border option screen
Border option
  1. Select the Advanced option. 
  2. Select the checkbox next to the Separate border option. The border is separated into the following:
    • Border Top
    • Border Right
    • Border Bottom
    • Border Left
Different borders for separate border option screen
Different borders selection
  1. Select the Color icon. The color selector opens.
    • Select a color to select it.
    • Or, select a theme to select it.
    • Or, select a recent color to select it.
Color selector screen
Color selector
  1. Type a value in pixels in the Weight field.
Weight field screen
Weight field
  1. Select a line style to select it.
Line style options screen
Line style options
Set border color and line screen
Color and line settings

You can set a different color and line style for each of the borders of a text element. 

Hidden Title

Need more help?