Back to Abp

The Official Themes

docs/en/ui-themes/index.md

10.4.02.3 KB
Original Source
json
//[doc-seo]
{
    "Description": "Explore ABP's official theming system, featuring the LeptonX and Basic themes, to enhance your application's UI effortlessly."
}

The Official Themes

ABP provides a complete UI theming system. While you can build your own themes, you can directly use the following pre-built themes in your applications.

The LeptonX Theme

LeptonX Theme is the official and default theme when you create a new ABP solution. A screenshot from the LeptonX theme:

LeptonX theme has two versions:

If you are looking for the legacy Lepton Theme documentation, please click here.

The Basic Theme

The Basic Theme is a minimalist theme that doesn't add any styling on top of the plain Bootstrap styles. You can take the Basic Theme as the base theme and build your own theme or styling on top of it. Here, a screenshot from the theme:

See the following documents based on the UI type you are using:

Blazor UI Library

When you create an ABP solution with a Blazor host (Blazor Server, Blazor WebAssembly or Blazor WebApp), you can additionally choose the underlying Blazor component library:

  • Blazorise — the original ABP default, based on Bootstrap.
  • MudBlazor — a Material-Design component library, available as an alternative variant. Each official theme has a MudBlazor version (e.g. MudBlazorLeptonXTheme, MudBlazorLeptonXLiteTheme, MudBlazorBasicTheme).

The choice is made at solution creation time via the --blazor-ui-library option (abp new ... -bul mudblazor) or in the ABP Studio new-solution wizard.

See Also