<Buttons>
    <Button>
        <Badge title="Badge top right">8</Badge>
        Button
    </Button>
    <Button>
        <Badge IsOutlined title="Badge top right">8</Badge>
        Button
    </Button>
</Buttons>

<Buttons>
    @foreach (Color color in Colors)
    {
        <Button><Badge Color="color">8</Badge>Button</Button>
    }
    @foreach (Color color in Colors)
    {
        <Button><Badge Color="color" IsLight>8</Badge>Button</Button>
    }
    @foreach (Color color in Colors)
    {
        <Button><Badge Color="color" IsOutlined IsLight>8</Badge>Button</Button>
    }
</Buttons>

@code{
    List<Color> Colors = new()
    {
        Color.Default, Color.Dark, Color.Info,
        Color.Link, Color.Success, Color.Warning, Color.Danger
    };
}

<Buttons>
    <Button><Badge IsTopLeft>8</Badge>Button</Button>
    <Button><Badge IsTop>8</Badge>Button</Button>
    <Button><Badge>8</Badge>Button</Button>
    <Button><Badge IsRight>8</Badge>Button</Button>
    <Button><Badge IsBottomRight>8</Badge>Button</Button>
    <Button><Badge IsBottom>8</Badge>Button</Button>
    <Button><Badge IsBottomLeft>8</Badge>Button</Button>
    <Button><Badge IsLeft>8</Badge>Button</Button>
</Buttons>
<Section>
    <div class="@B.BackgroundGreyLighter" style="position:relative;width: 80%;height: 150px;margin: auto">
        <Badge IsTopLeft Color="Color.Danger">Badge top left</Badge>
        <Badge IsTop Color="Color.Success">Badge top center</Badge>
        <Badge Color="Color.Info">Badge top right (默认)</Badge>
        <Badge IsRight Color="Color.Primary">Badge right</Badge>
        <Badge IsBottomRight Color="Color.Primary">Badge bottom right</Badge>
        <Badge IsBottom>Badge bottom center</Badge>
        <Badge IsBottomLeft Color="Color.Warning">Badge bottom left</Badge>
        <Badge IsLeft Color="Color.Primary">Badge left</Badge>
    </div>
</Section>