Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Footagesus/WindUI/llms.txt

Use this file to discover all available pages before exploring further.

Add a button to a tab or group by calling :Button({...}). The returned object exposes a :Highlight() method you can call programmatically.

​
Parameters

​
Title
string
Label displayed on the button. Defaults to "Button" when omitted.
​
Desc
string
Secondary line of text rendered beneath the title.
​
Icon
string
Lucide icon name shown alongside the title. Pass "" to hide the icon entirely.
​
Color
Color3
Background tint for the button element. When set, the icon color adapts automatically for contrast.
​
Justify
"Left" | "Center" | "Right"
Horizontal alignment of the content inside the button. Defaults to "Between" (title on the left, icon on the right).
​
IconAlign
"Left" | "Right"
Side the icon is placed on. Defaults to "Right".
​
Locked
boolean
When true, the button is overlaid with a lock indicator and the callback is suppressed.
​
LockedTitle
string
Custom text shown on the lock overlay. Defaults to "Locked".
​
Callback
function
Called when the user clicks the button.

​
Methods

Plays a brief sweep animation across the button outline. Useful as visual feedback after an action completes.
local myButton
myButton = Tab:Button({
  Title = "Highlight Button",
  Icon = "mouse",
  Callback = function()
    myButton:Highlight()
  end,
})

​
Examples

​
Default button

Tab:Button({
  Title = "Notify Button",
  Callback = function()
    WindUI:Notify({
      Title = "Hello",
      Content = "Welcome to the WindUI Example!",
      Icon = "solar:bell-bold",
      Duration = 5,
    })
  end,
})

​
Colored button

Tab:Button({
  Title = "Blue Button",
  Color = Color3.fromHex("#305dff"),
  Icon = "",
  Callback = function() end,
})

​
Button with description

Tab:Button({
  Title = "Blue Button",
  Desc = "With description",
  Color = Color3.fromHex("#305dff"),
  Icon = "",
  Callback = function() end,
})

​
Button with Highlight callback

local HighlightButton
HighlightButton = Tab:Button({
  Title = "Highlight Button",
  Icon = "mouse",
  Callback = function()
    print("clicked highlight")
    HighlightButton:Highlight()
  end,
})

​
Locked button

Tab:Button({
  Title = "Button",
  Locked = true,
  LockedTitle = "This element is locked",
})
Use Color together with Justify = "Center" and Icon = "" to create prominent full-width action buttons, as seen in the config panel’s Save/Load pattern.

Build docs developers (and LLMs) love

Get started for freeTalk to us