Documentation menu · Compare
Comparison

AuraGlass vs Building In-House

Compare buying a production Liquid Glass React system with building blur, motion, themes, accessibility, and visual QA internally.

#Build In-House When

Build in-house when the glass material is core product IP, the design team has a unique interaction model, and the engineering team can fund the long tail: tokens, CSS architecture, React APIs, accessibility states, docs, visual regression, performance budgets, SSR behavior, and release management.

This path gives maximum ownership. It also means every bug is yours: overlay stacking, contrast over media, focus traps, reduced-motion fallbacks, chart readability, mobile density, optional peer boundaries, and documentation drift.

Best reason
The visual system is strategic IP
Team needed
Design systems, frontend platform, accessibility, QA
Hidden cost
Maintenance across every state and framework change
Timeline risk
Polish often takes longer than the first prototype

#Use AuraGlass When

Use AuraGlass when the product needs a premium interface now and the team would rather adopt a package than build a glass system from scratch. The package supplies component APIs, style tokens, containment props, recipes, optional-peer guidance, and docs that agents and engineers can follow.

The tradeoff is visual opinion. AuraGlass is not a blank primitive kit. It is meant to give the app a polished Liquid Glass direction quickly, then let the team tune tokens and layouts without owning the entire material engine.

tsx
import {
  GlassCard,
  GlassDashboard,
  GlassDataChart,
  GlassDataGrid,
  GlassSidebar,
} from 'aura-glass';
import 'aura-glass/styles';

export function RevenueDashboard() {
  return (
    <GlassDashboard
      title="Revenue command"
      contained
      compact
      maxHeight={720}
    >
      <GlassSidebar contained compact showToggle={false} />
      <GlassCard>
        <GlassDataChart />
      </GlassCard>
      <GlassDataGrid />
    </GlassDashboard>
  );
}

#Cost Comparison

A credible in-house build must budget for more than blur and rounded corners. The team needs component semantics, keyboard interaction, layout containment, portal behavior, dark mode, reduced motion, route-level performance, docs, examples, and upgrade testing.

A package adoption still needs review, but the review starts from working components and documented contracts. That is the difference between buying a product surface and starting from a visual experiment.

Material design
In-house owns it; AuraGlass provides defaults and tokens
Component APIs
In-house designs every API; AuraGlass provides public exports
Docs
In-house writes them; AuraGlass ships adoption and agent docs
Performance
Both require QA; AuraGlass provides guidance and containment props