<div class="space-y-4">
    <div>
        <h3 class="text-sm font-medium mb-2">Extra Small (xs)</h3>
        <c-lb.menu size="xs" class="bg-base-100 rounded-box w-48 shadow">
            <c-lb.menu.item href="/" title="Home" />
            <c-lb.menu.item href="/about" title="About" />
        </c-lb.menu>
    </div>

    <div>
        <h3 class="text-sm font-medium mb-2">Small (sm)</h3>
        <c-lb.menu size="sm" class="bg-base-100 rounded-box w-56 shadow">
            <c-lb.menu.item href="/" title="Home" />
            <c-lb.menu.item href="/about" title="About" />
        </c-lb.menu>
    </div>

    <div>
        <h3 class="text-sm font-medium mb-2">Medium (md) - Default</h3>
        <c-lb.menu size="md" class="bg-base-100 rounded-box w-64 shadow">
            <c-lb.menu.item href="/" title="Home" />
            <c-lb.menu.item href="/about" title="About" />
        </c-lb.menu>
    </div>

    <div>
        <h3 class="text-sm font-medium mb-2">Large (lg)</h3>
        <c-lb.menu size="lg" class="bg-base-100 rounded-box w-72 shadow">
            <c-lb.menu.item href="/" title="Home" />
            <c-lb.menu.item href="/about" title="About" />
        </c-lb.menu>
    </div>
</div>
