• Theme, Material y Backdrop: valores locales de entorno.
• IncreaseContrast y LiquidTokenProvider: contraste y personalización de tokens.
• GlassPrimitive: elemento de cristal polimórfico.
• useGlass: clases, atributos de datos y props de estilo para una superficie propia.
• Tipos de material, rendimiento, forma, lente y controlador para integraciones avanzadas.

import { GlassPrimitive, Material, Theme } from "@liquidify/glass"
import "@liquidify/glass/glass.css"

export function CustomPanel({ children }: { children: React.ReactNode }) {
  return (
    <Theme type="system">
      <Material default="frosted">
        <GlassPrimitive as="section" aria-label="Account summary">
          {children}
        </GlassPrimitive>
      </Material>
    </Theme>
  )
}

GlassPrimitive usa div de forma predeterminada. as adapta las props nativas y el tipo de ref. Los proveedores son opcionales; el motor monta los filtros compartidos en el cliente. Un proveedor Material explícito delimita su configuración.

material-tokens.css contiene variables generadas para composición avanzada. Usa glass.css salvo que configures el motor directamente.