Skip to content

Home

Pantheon is a set of user interface components for Roblox. It is built on Fusion 0.3. It has about 70 components, a light and a dark theme, and a separate set for game HUDs.

Get started Using Pantheon

Note

Pantheon is still being built. It is not on Wally yet, and parts of it will change before version 1.

Features

  • Theming

    Components take their colours, fonts and spacing from a theme. Change the theme and every component changes with it. Light and dark themes are included.

    Theming

  • State that survives a rebuild

    Controls can keep what the user entered when you rebuild the interface. This means you can change the theme or the layout without losing anything.

    Persisting state

  • Accessibility

    Components follow the player's settings for reduced motion, transparency and text size. Controls work with a keyboard or a gamepad.

    Accessibility

  • Game components

    A hotbar with an inventory panel, a backpack, a leaderboard and a top bar. They are styled for games and do not use the app theme.

    Hotbar

  • DevTools

    A panel for inspecting an interface while it runs. You can browse the element tree and change properties.

    DevTools

  • Built with Fusion

    You can give most properties a Fusion state. The component updates when the state changes. If you give a control a Value, the control and the Value stay in step both ways.

    Common properties

A first look

local Pantheon = require(Packages.Pantheon)
local C = Pantheon.Components

local scope = Pantheon.scoped()
local theme = Pantheon.Theme.create("Light")

Pantheon.Theme.Provide(theme, function()
    C.Button(scope, {
        Text = "Run",
        Variant = "Filled",
        OnClick = function()
            print("Running")
        end,
    })
end)

Where to go next