Supported Features

Layout

Figma Feature	Roblox Result
Absolute position	UDim2 (Scale-based)
Auto Layout (Vertical)	UIListLayout (Vertical)
Auto Layout (Horizontal)	UIListLayout (Horizontal)
Padding	UIPadding
Gap (item spacing)	UIListLayout.Padding
Hug contents	AutomaticSize
Clip content	ClipsDescendants
Prototype Overflow scroll	ScrollingFrame, scrolls along the chosen axis
Figma Grid / Wrap layout	UIGridLayout
Linear Repeat groups	Expanded into repeated Roblox instances

Visual

Figma Feature	Roblox Result
Solid fill	BackgroundColor3 + BackgroundTransparency
Linear gradient	UIGradient
Opacity	BackgroundTransparency / ImageTransparency / TextTransparency
Corner radius	UICorner (Scale-based)
Individual corner radius	Per-corner UICorner properties with Native UI beta enabled
Stroke	UIStroke
Gradient stroke	UIStroke + UIGradient
Stroke alignment	UIStroke BorderStrokePosition
Stroke joins	UIStroke LineJoinMode
Multiple strokes	Multiple UIStroke children via _stroke
Rotation	Rotation (with recenter)
Drop shadow	UIShadow with Native UI beta enabled

Native Roblox UI beta

For editable native shadows and individual corner radii, enable New UI Capabilities in Roblox Studio Beta Features, then enable Roblox native UI beta in FigBloxUI settings. See Roblox’s New UI Capabilities announcement.

Text

Figma Feature	Roblox Result
Font family	FontFace (50+ mappings)
Font weight	FontFace.Weight
Italic text	FontFace.Style
Font size	TextSize
Text alignment	TextXAlignment + TextYAlignment
Text auto-resize	AutomaticSize
Text wrapping	TextWrapped
Text scaling	TextScaled + UITextSizeConstraint
Line height	LineHeight
Mixed styles	RichText with <font> tags
UPPERCASE/lowercase	TextCase transformation
Underline/Strikethrough	RichText <u> / <s> tags
Text truncation	TextTruncate

Double-stroke text

Roblox supports one UIStroke per text label. For a two-layer outline (a thin dark stroke inside a thick light one), stack two copies of the text in Figma with the bottom copy carrying the outer stroke. FigBloxUI converts both layers as-is, so the result matches your design exactly. If the text changes at runtime, update the Text property on both labels.

Images

Figma Feature	Roblox Result
Image fill	ImageLabel (auto-upload)
Vector shapes	ImageLabel (exported as PNG)
Complex effects (unsupported shadows, blur)	ImageLabel (flattened to PNG)
Mixed corner radii	Per-corner UICorner with Native UI beta, otherwise flattened
Multiple fills	ImageLabel (flattened)
Tintable icons	_gray image mask + ImageColor3
Transparent edge cleanup	PixFix mode removes dark halos around PNG edges

Smart Detection

• Emoji text: Text layers containing emoji are automatically exported as PNG images, because Roblox renders emoji differently from Figma. Exporting as an image ensures your design looks exactly the same. If you’d like an option to export emoji as text instead, feel free to request it!
• Text as image: Add _ImageLabel or _ImageButton suffix to a TEXT node to export it as a PNG image. Useful for decorative text that should be rendered as an image in Roblox.
• Button detection: Frames with text children and interactive names are auto-detected as TextButton or ImageButton.
• Native UI beta: Supported drop shadows and individual corner radii stay editable as native Roblox instances when the beta toggle is enabled.
• Scrolling frames: Set Scroll behavior > Overflow (Horizontal or Vertical) in Figma’s Prototype panel, or add a _ScrollingFrame suffix, to turn a frame into a ScrollingFrame that scrolls along that axis. Size the frame to the visible window you want; content extending past it becomes the scrollable canvas.
• Repeat groups: Linear Figma Repeat groups are expanded into normal repeated Roblox instances. When a Repeat group opts into scrolling (suffix or prototype Overflow), every declared clone is kept and the rows hidden behind a mask scroll into view. Radial repeats are not converted yet.
• Tintable icons: Add _gray to an image or icon layer to export a white mask that can be recolored with Roblox ImageColor3.
• PixFix mode: Cleans dark halos around transparent image edges, especially rounded corners and soft edges.
• Visual-only nodes: Nodes with effects Roblox can’t render natively are automatically flattened to PNG.

Flattened / Limited

These Figma features don’t have editable Roblox equivalents, so FigBloxUI exports them as PNG images when needed:

• Radial/Angular/Diamond gradients
• Inner shadows
• Blur effects
• Blend modes
• Brush / textured strokes
• Masks (partially flattened)

Not Supported

These Figma features are not converted yet:

• Radial Repeat groups