Documentation

npm install @alrehla/atmosfera

import { Atmosfera } from '@alrehla/atmosfera';

// Generate theme from emotional state
const theme = Atmosfera.generate({
  emotion: {
    state: 'stable',   // 'crisis' | 'struggling' | 'stable' | 'thriving' | 'flow'
    tension: 30,       // 0-100
    shadow: 20,        // 0-100
    engagement: 70,    // 0-100
  },
  timeOfDay: 'evening', // optional, auto-detected
  mode: 'dark',         // 'light' | 'dark' | 'auto'
});

// Apply to DOM -- sets CSS variables on <html>
Atmosfera.apply(theme);

// Access generated values
console.log(theme.colors.primary);     // 'hsl(180, 49%, 64%)'
console.log(theme.cssVariables);       // { '--atm-primary': '...', ... }
console.log(theme.animations);         // 'normal'

// POST /api/v1/generate
const response = await fetch('https://atmosfera.alrehla.app/api/v1/generate', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    state: 'thriving',
    tension: 20,
    shadow: 10,
    engagement: 90,
    mode: 'dark',
  }),
});

const { theme } = await response.json();
// theme.cssVariables -> ready for SSR injection

--atm-primary          /* Primary color */
--atm-background       /* Background color */
--atm-text             /* Text color */
--atm-accent           /* Accent color */
--atm-border-radius    /* Corner radius (px) */
--atm-spacing          /* Base spacing (rem) */
--atm-blur             /* Blur intensity (px) */
--atm-contrast         /* Contrast multiplier */
--atm-animation-duration   /* Animation speed */
--atm-transition       /* Smooth transition curve */
--atm-vignette         /* Vignette overlay opacity */
--atm-grain            /* Film grain opacity */
--atm-aberration       /* Chromatic aberration */