Skip to main content

DropShadowFrame

A container frame equivalent in appearance to a Background with a drop shadow in the lower right sides and corner. This matches the appearance of some built-in Roblox Studio elements such as tooltips. It is useful for providing contrast against a background.

Dark Light
Dark Light

Any children passed will be parented to the container frame. For example:

local function MyComponent()
	return React.createElement(StudioComponents.DropShadowFrame, {}, {
		MyLabel = React.createElement(StudioComponents.Label, ...),
		MyCheckbox = React.createElement(StudioComponents.Checkbox, ...),
	})
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": 65,
                "path": "src/Components/DropShadowFrame.luau"
            }
        }
    ],
    "name": "DropShadowFrame",
    "desc": "A container frame equivalent in appearance to a [Background] with a \ndrop shadow in the lower right sides and corner.\nThis matches the appearance of some built-in Roblox Studio elements such as tooltips.\nIt is useful for providing contrast against a background.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/dropshadowframe/dark.png) | ![Light](/StudioComponents/components/dropshadowframe/light.png) |\n\nAny children passed will be parented to the container frame. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.DropShadowFrame, {}, {\n\t\tMyLabel = React.createElement(StudioComponents.Label, ...),\n\t\tMyCheckbox = React.createElement(StudioComponents.Checkbox, ...),\n\t})\nend\n```",
    "source": {
        "line": 24,
        "path": "src/Components/DropShadowFrame.luau"
    }
}