New to Telerik UI for Blazor? Download free 30-day trial

Appearance Settings

You can control the appearance of the RadioButtonGroup button by setting the following attribute:

Size

Change the size of the radio buttons by setting the Size parameter to a member of the Telerik.Blazor.ThemeConstants.Button.Size class:

Class members Manual declarations
Small sm
Medium md
Large lg

The built-in sizes

@{
    var fields = typeof(Telerik.Blazor.ThemeConstants.Button.Size)
        .GetFields(System.Reflection.BindingFlags.Public | System.Reflection.BindingFlags.Static
        | System.Reflection.BindingFlags.FlattenHierarchy)
        .Where(field => field.IsLiteral && !field.IsInitOnly).ToList();


    @foreach (var field in fields)
    {
        string size = field.GetValue(null).ToString();

        <div style="float:left; margin: 20px;">
            <TelerikRadioGroup Size="@size"
                               Data="@Options"
                               @bind-Value="@ChosenOption">
            </TelerikRadioGroup>
        </div>
    }
}

@code{
    string ChosenOption { get; set; }

    List<string> Options { get; set; } = new List<string>()
    {
        "first", "second", "third"
    };
}
In this article