Skip to main content

Background

A borderless frame matching the default background color of Studio widgets.

Dark Light
Dark Light

Any children passed will be parented to the frame, which makes it suitable for use as, for example, the root component in a plugin Widget. For example: 

local function MyComponent()
	return React.createElement(StudioComponents.Background, {}, {
		MyChild = React.createElement(...),
	})
end

Types​

Props​

Component Props
</>
interface Props {
children: React.ReactNode
}
Show raw api
{
    "functions": [],
    "properties": [],
    "types": [
        {
            "name": "Props",
            "desc": "",
            "fields": [
                {
                    "name": "...",
                    "lua_type": "CommonProps",
                    "desc": ""
                },
                {
                    "name": "children",
                    "lua_type": "React.ReactNode",
                    "desc": ""
                }
            ],
            "tags": [
                "Component Props"
            ],
            "source": {
                "line": 35,
                "path": "src/Components/Background.luau"
            }
        }
    ],
    "name": "Background",
    "desc": "A borderless frame matching the default background color of Studio widgets.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/background/dark.png) | ![Light](/StudioComponents/components/background/light.png) |\n\nAny children passed will be parented to the frame, which makes it suitable for use as, \nfor example, the root component in a plugin Widget. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Background, {}, {\n\t\tMyChild = React.createElement(...),\n\t})\nend\n```",
    "source": {
        "line": 21,
        "path": "src/Components/Background.luau"
    }
}