UIStroke
Applies an outline to text or a UI border.
Memory category | Instances |
---|
Member index 10
Description
UIStroke applies an outline to text or a UI border. Key features include:
- Adjust the Color and Thickness of the stroke outline.
- Change the stroke Transparency independently from the text or UI object.
- Choose the LineJoinMode of the stroke (round, bevel, or miter).
- Specify the BorderStrokePosition on its parent's border and/or an additional BorderOffset to the stroke's position.
- Add a gradient to the stroke via the UIGradient instance.
- Use rich text tags to add stroke to inline text segments.
For more details on the UIStroke object, see Appearance Modifiers.
History 23
- 685 Add ZIndex
- 685 Add StrokeSizingMode
- 684 Add BorderStrokePosition
- 684 Add BorderOffset
- 553 Change Default of Transparency from to 0
- 553 Change Default of Thickness from to 1
- 553 Change Default of LineJoinMode from to Round
- 553 Change Default of Enabled from to true
- 553 Change Default of Color from to Color3(0, 0, 0)
- 553 Change Default of ApplyStrokeMode from to Contextual
- 486 Change ThreadSafety of Transparency from ReadOnly to ReadSafe
- 486 Change ThreadSafety of Thickness from ReadOnly to ReadSafe
- 486 Change ThreadSafety of LineJoinMode from ReadOnly to ReadSafe
- 486 Change ThreadSafety of Enabled from ReadOnly to ReadSafe
- 486 Change ThreadSafety of Color from ReadOnly to ReadSafe
- 486 Change ThreadSafety of ApplyStrokeMode from ReadOnly to ReadSafe
- 466 Add Transparency
- 466 Add Thickness
- 466 Add LineJoinMode
- 466 Add Enabled
- 466 Add Color
- 466 Add ApplyStrokeMode
- 466 Add UIStroke
Members 10
ApplyStrokeMode
Type | Default | |
---|---|---|
ApplyStrokeMode | Contextual |
When a UIStroke instance is applied to a text object, this property determines whether to apply the stroke to the object's border instead of the text itself.

ApplyStrokeMode
= Contextual
ApplyStrokeMode
= BorderThread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
History 3
- 553 Change Default of ApplyStrokeMode from to Contextual
- 486 Change ThreadSafety of ApplyStrokeMode from ReadOnly to ReadSafe
- 466 Add ApplyStrokeMode
BorderOffset
Type | Default | |
---|---|---|
UDim | 0, 0 |
This property specifies an additional offset (UDim) to the stroke's position, relative to the parent's minimum height or width.

BorderOffset
= (0.15, 0)

BorderOffset
= (0, -16)
Thread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
History 1
- 684 Add BorderOffset
BorderStrokePosition
Type | Default | |
---|---|---|
BorderStrokePosition | Outer |
This property determines the stroke's position on its parent's border as an BorderStrokePosition value.

BorderStrokePosition
= Center
BorderStrokePosition
= Inner
BorderStrokePosition
= OuterThread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
History 1
Color
Type | Default | |
---|---|---|
Color3 | 0, 0, 0 |
Determines the UIStroke color. You can also insert a UIGradient instance as a child to create gradient strokes.

Color
= (0, 95, 225)

UIStroke
with UIGradient childThread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
Enabled
Type | Default | |
---|---|---|
bool | true |
This property determines whether the UIStroke is visible. When set
to false
, the stroke will not be rendered. Defaults to true
.
Thread safety | ReadSafe |
---|---|
Category | Data |
Loaded/Saved | true |
LineJoinMode
Type | Default | |
---|---|---|
LineJoinMode | Round |
This property determines how corners are interpreted. It accepts an LineJoinMode value of either Round (default), Bevel, or Miter.

LineJoinMode
= Round
LineJoinMode
= Bevel
LineJoinMode
= MiterThread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
History 3
- 553 Change Default of LineJoinMode from to Round
- 486 Change ThreadSafety of LineJoinMode from ReadOnly to ReadSafe
- 466 Add LineJoinMode
StrokeSizingMode
Type | Default | |
---|---|---|
StrokeSizingMode | FixedSize |
This property determines whether the stroke's Thickness will be measured in pixels or be scaled relative to the parent. See StrokeSizingMode for further details.
Thread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
History 1
- 685 Add StrokeSizingMode
Thickness
Type | Default | |
---|---|---|
float | 1 |
This property determines the stroke's thickness, measured in pixels (default) or scaled relative to the parent, depending on StrokeSizingMode.

Thickness
= 4

Thickness
= 12
Be mindful of tweening this UIStroke property when applied to text objects. This renders and stores many glyph sizes each frame, potentially causing performance issues or text flickering.
Thread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
Transparency
Type | Default | |
---|---|---|
float | 0 |
This property sets the stroke opacity independently of the parent object's BackgroundTransparency or TextTransparency. This allows you to render text and borders that are "hollow" (consisting of only an outline).

Transparency
= 0.5
· TextLabel.TextTransparency = 0

Transparency
= 0
· TextLabel.TextTransparency = 1
Thread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |
History 3
- 553 Change Default of Transparency from to 0
- 486 Change ThreadSafety of Transparency from ReadOnly to ReadSafe
- 466 Add Transparency
ZIndex
Type | Default | |
---|---|---|
int | 1 |
This property determines the order in which the stroke renders relative to
sibling UIStroke instances. Those with a lower ZIndex
render
under (behind) those with a higher ZIndex
.
Note that the rendering order for UIStroke instances with the same
ZIndex
is undefined. Do not apply multiple UIStroke instances
with the same ZIndex
if their rendering order matters.
Thread safety | ReadSafe |
---|---|
Category | Appearance |
Loaded/Saved | true |