Introduction

RSML (Roblox Style Management Language) is a declarative language for defining Roblox StyleSheet's.

Example

./button.rsml

@derive "base";

.Button {
    @priority 50;
    AutomaticSize = :XY;
    TextColor3 = $ColorText;
    FontFace = $FontFace;
    TextSize = $TextSize;
    CornerRadius! (15px);
    Padding! (25px);

    .Primary {
        BackgroundColor3 = $ColorPrimary;
    }

    .Secondary {
        BackgroundColor3 = $ColorSecondary;
    }

    .Destructive {
        BackgroundColor3 = $ColorDestructive;
    }

    .Disabled {
        BackgroundTransparency = .4;
        Interactable = false;
    }
}

./base.rsml

$FontFace = font ("BuilderSans", :SemiBold);
$TextSize = 14;
$ColorText = tw:slate:50;
$ColorPrimary = tw:blue:700;
$ColorSecondary = tw:slate:700;
$ColorDestructive = tw:rose:700;

Integrations

RSML CLI

A codegen CLI which converts .rsml files to .model.json files in the local file system.

• Documentation
• Github Repo

---

RSML Luau

A package designed to convert stringified rsml inside .luau and .ts files into Instances in the DataModel at runtime. Also exposes a lexer and parser.

• Github Repo
• Wally Package
• NPM Package

WARNING

The RSML Luau version currently uses a slightly outdated version of RSML (it does not have macros, oklab and oklch color spaces, skin color codes, or static attributes).

---

RSML Rojo

A Rojo fork which converts .rsml files to Roblox instances in the DataModel.

• Github Repo

WARNING

The RSML Rojo fork currently uses an extremely outdated version of RSML which means there are a lot of discrepencies between it and the docs.

---

RSML Rust

A crate designed for lexing and parsing RSML.

• Github Repo
• Crates.io

IDE Support

VS Code Extension

Adds syntax highlighting to .rsml files. Also adds highlighting to luau and typscript strings prefixed with the --!rsml (or --[=*[rsml!]=*]) sigil.

• Github Repo
• VS Marketplace