CmAvatar

import { CmAvatar } from "cosmemilton-ui/client";

import { CmAvatar } from "cosmemilton-ui/client";
import { CmRow, CmStack, CmText } from "cosmemilton-ui/server";

export default function Example() {
  return (
    <CmStack gap="md">
      <CmRow gap="sm" align="center">
        <CmAvatar
          size="lg"
          src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=128&h=128&fit=crop&crop=faces"
          alt="Ana Souza"
          fallback="AS"
        />
        <CmStack gap="xs">
          <CmText weight="semibold">Ana Souza</CmText>
          <CmText tone="muted">Gerente de contas</CmText>
        </CmStack>
      </CmRow>
      <CmRow gap="sm" align="center">
        <CmAvatar size="xs" fallback="XS" />
        <CmAvatar size="sm" fallback="SM" />
        <CmAvatar size="md" fallback="MD" />
        <CmAvatar size="lg" fallback="LG" />
        <CmAvatar size="xl" fallback="XL" />
      </CmRow>
    </CmStack>
  );
}