BlazorUI Demo

Surface

A neutral themed region for grouping content without the semantic structure or interaction of a card.

Surface treatments

Default padding

Selected, large

Flush, interactive

View code
<BuiGrid Columns="3" Gap="3">
    <BuiGridItem Xs="1"><BuiSurface><BuiText>Default padding</BuiText></BuiSurface></BuiGridItem>
    <BuiGridItem Xs="1"><BuiSurface Size="Size.Large" Selected><BuiText>Selected, large</BuiText></BuiSurface></BuiGridItem>
    <BuiGridItem Xs="1"><BuiSurface Flush Interactive><BuiText Class="p-4">Flush, interactive</BuiText></BuiSurface></BuiGridItem>
</BuiGrid>