Design System P48v3.0.0 Pro · 2026

Arivu Tech Design System Reference

Master token sheet, TypeUI spatial grid principles, glassmorphic depth layers, and interactive component library.

01. Canvas & Surface Hierarchy

Multi-layered dark theme surfaces built for high-contrast enterprise SaaS interfaces.

--bg-primary

#080B0E

Page root background

--bg-surface

#0A0F14

Section background

--bg-elevated

#111820

Sidebar & elevated cards

--bg-card

#1A2332

Interactive cards

--bg-hover

#1E293B

Hover overlays

02. Sector Accent Palettes

Dedicated domain accent colors representing Arivu's six core industry verticals.

Agritech

#22C55E

Manufacturing

#F59E0B

Healthcare

#EF4444

Infrastructure

#3B82F6

Hospitality

#A855F7

Construction

#F97316

03. Typography Scale & Fonts

Space Grotesk for display headers, Satoshi for UI body text, and JetBrains Mono for code.

Display XL - Space Grotesk (72px)

Software that powers scale

Heading 1 - Space Grotesk (48px)

Enterprise Software Solutions

Body LG - Satoshi (18px)

Arivu Technologies builds mission-critical industrial software, enterprise SaaS security platforms, and high-performance IoT telemetry gateways for global industries.

Code Mono - JetBrains Mono (13px)

const app = await NestFactory.create(AppModule);

04. Core UI Components

TypeUI-compliant glass cards, badges, buttons, metric callouts, and code consoles.

Button Variants & Interaction States

Enterprise Metric Callouts

500++14% YoY

Enterprise Projects Delivered

< 5 minVerified

Cyber Incident Response SLA

99.99%Live

Telemetry Uptime SLA

34%+34%

Agritech Crop Yield Uplift

Glassmorphic Bento Cards

Agritech Suite

LoRaWAN Edge Telemetry

Real-time soil sensor data collection with offline storage and satellite yield forecasting models.

Industry 4.0

Predictive Maintenance

SCADA and PLC MQTT stream analysis detecting anomaly vibration patterns before line failure.

Smart City

Civic Asset Grid

GIS-mapped infrastructure monitoring managing over 45,000 active urban sensor endpoints.

Tech Ecosystem Console

app/services/page.tsx

1import { GlassCard } from "@/components/ui/GlassCard";
2import { GradientHeading } from "@/components/ui/GradientHeading";
3
4export default async function ServicesPage() {
5  const services = await getEnterpriseServices();
6  return (
7    <section className="py-24 px-6 max-w-7xl mx-auto">
8      <GradientHeading
9        as="h1"
10        gradient="cyan"
11        gradientText="Enterprise Software"
12        afterText="at Scale"
13        subtitle="Precision engineered systems built for global performance."
14      />
15    </section>
16  );
17}

WCAG 2.1 AA Compliant

Accessibility & Micro-Interaction Contract

All contrast ratios exceed 4.5:1 for normal copy and 3:1 for large display elements. High-contrast visible focus rings (`:focus-visible`) are enforced across all interactive controls. Reduced motion fallbacks disable animations when requested by system preferences.