<
See More

!><!>

Leptos Components · Rust UI Component Library | Rust/UI<!><!><!><!><!><!><!><!><!>
    <!>
<!>
<!><!>
<!>
<!>
<!>
<!>
<!>
<!><!>

Build once, run Everywhere.<!>

Rust/UI is a cross-platform component registry for Leptos and Rust fullstack applications. Build your UI once and deploy to iOS, Android, Desktop, and Web.<!>
<!><!>
<!><!>
  • Default<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Amber<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Blue<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Cyan<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Emerald<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Fuchsia<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Green<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Indigo<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Lime<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Orange<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Pink<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Purple<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Red<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Rose<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Sky<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Teal<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Violet<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • Yellow<!>Rust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!>

Theme<!>

Copy and paste the following code into your CSS file.<!>

:root {
  --radius: 0.5rem;
  --font-sans: 'Inter', sans-serif;
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
}

.dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.205 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.205 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.87 0.00 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.371 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(0.556 0 0);
}<!><!>
<!>
<!>
<!>
<!><!>
<!><!>
<!>
<!><!>
<!><!>
<!><!><!>
<!><!>

Total Revenue<!>

<!>
$15,231.89<!>

+20.1% from last month<!>

<!>
<!><!>
<!><!>

Subscriptions<!>

<!>
+2350<!>

+180.1% from last month<!>

<!>
<!><!>
<!><!>
<!><!>
May<!>2025<!><!><!><!>
<!><!><!><!><!><!><!><!><!><!><!><!><!><!><!><!><!>
Mo<!>Tu<!>We<!>Th<!>Fr<!>Sa<!>Su<!>
28<!>29<!>30<!>1<!>2<!>3<!>4<!>
5<!>6<!>7<!>8<!>9<!>10<!>11<!>
12<!>13<!>14<!>15<!>16<!>17<!>18<!>
19<!>20<!>21<!>22<!>23<!>24<!>25<!>
26<!>27<!>28<!>29<!>30<!>31<!>1<!>
<!><!>

Move Goal<!>

Set daily activity goal.<!>

<!><!>
350<!>
Calories/day
<!><!>
<!><!>
<!>
<!>
<!><!>
<!>
<!><!>
<!>

Exercise Minutes<!>

Your exercise minutes are ahead of where you normally are.<!>

<!><!>
<!>
<!>
<!><!>
<!>
<!><!>

Team Members<!>

Invite your team members to collaborate.<!>

<!><!>
OM<!>
<!>
<!><!>
  • OwnerRust/UI Icons - Check<!><!><!><!><!><!>
  • MemberRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
JL<!>
<!>
<!><!>
  • OwnerRust/UI Icons - Check<!><!><!><!><!><!>
  • MemberRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
IN<!>
<!>

Isabella Nguyen

[email protected]

<!><!>
  • OwnerRust/UI Icons - Check<!><!><!><!><!><!>
  • MemberRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
<!><!>
<!><!>

Cookie Settings<!>

Manage your cookie settings here.<!>

<!><!>
Strictly Necessary These cookies are essential in order to use the website and use its features.
<!><!>
Functional Cookies These cookies allow the website to provide personalized functionality.
<!><!>
<!><!>
<!>
<!><!>

Payment Method<!>

Add a new payment method to your account.<!>

<!><!>
<!><!>
<!><!>
<!><!>
<!><!>
  • JanuaryRust/UI Icons - Check<!><!><!><!><!><!>
  • FebruaryRust/UI Icons - Check<!><!><!><!><!><!>
  • MarchRust/UI Icons - Check<!><!><!><!><!><!>
  • AprilRust/UI Icons - Check<!><!><!><!><!><!>
  • MayRust/UI Icons - Check<!><!><!><!><!><!>
  • JuneRust/UI Icons - Check<!><!><!><!><!><!>
  • JulyRust/UI Icons - Check<!><!><!><!><!><!>
  • AugustRust/UI Icons - Check<!><!><!><!><!><!>
  • SeptemberRust/UI Icons - Check<!><!><!><!><!><!>
  • OctoberRust/UI Icons - Check<!><!><!><!><!><!>
  • NovemberRust/UI Icons - Check<!><!><!><!><!><!>
  • DecemberRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
  • 2024Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2025Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2026Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2027Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2028Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2029Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2030Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2031Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2032Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2033Rust/UI Icons - Check<!><!><!><!><!><!>
  • 2034Rust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!>
<!><!>
<!><!>
SD<!>
<!>
<!><!>
<!><!>
Hi, how can I help you today?<!>
Hey, I'm having trouble with my account.<!>
What seems to be the problem?<!>
I can not log in.<!>
<!><!>
<!>
<!><!>
<!>
<!><!>

Create an account<!>

Enter your email below to create your account<!>

<!><!>
<!><!>
Or continue with
<!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!>
<!><!>
<!><!>
<!><!>
<!><!>

Share this document<!>

Anyone with the link can view this document.<!>

<!><!>
<!><!>

People with access

OM<!>
<!>

Olivia Martin

[email protected]

<!><!>
  • Can EditRust/UI Icons - Check<!><!><!><!><!><!>
  • Can ViewRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
IN<!>
<!>

Isabella Nguyen

[email protected]

<!><!>
  • Can EditRust/UI Icons - Check<!><!><!><!><!><!>
  • Can ViewRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
SD<!>
<!>
<!><!>
  • Can EditRust/UI Icons - Check<!><!><!><!><!><!>
  • Can ViewRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!><!>

Report an issue<!>

What area are you having problems with?<!>

<!><!>
  • BillingRust/UI Icons - Check<!><!><!><!><!><!>
  • TeamRust/UI Icons - Check<!><!><!><!><!><!>
  • AccountRust/UI Icons - Check<!><!><!><!><!><!>
  • SupportRust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
  • Level 1Rust/UI Icons - Check<!><!><!><!><!><!>
  • Level 2Rust/UI Icons - Check<!><!><!><!><!><!>
  • Level 3Rust/UI Icons - Check<!><!><!><!><!><!>
  • Level 4Rust/UI Icons - Check<!><!><!><!><!><!>
  • <!><!>
<!><!>
<!><!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!><!>
<!>
<!><!>
<!><!>
<!><!>

Build your App<!>

A registry of reusable Leptos components built with Tailwind CSS. Copy, paste, and customize for your Rust applications. <!>

Start now<!><!><!>
<!><!><!>
<!>
<!>
<!><!><!>
<!>
<!><!><!> <!><!>

!>