Plumeria
Atomic CSS-in-JS

Zero-runtime overhead・Type-safe
Build-time only・High performance

Get StartedInstallation
const styles = css.create({
  featureCard: {
    position: 'relative',
    padding: '24px',
    background: 'var(--card-bg)',
    backdropFilter: 'blur(16px)',
    WebkitBackdropFilter: 'blur(16px)',
    border: '1px solid var(--card-border)',
    borderRadius: '16px',
    boxShadow: 'var(--card-shadow), var(--card-cut-glass)',
    transition: 'all 0.3s ease',
    [pseudos.hover]: {
      borderColor: 'var(--card-hover-border)',
      transform: 'translateY(-2px)',
    },
    [breakpoints.md]: {
      padding: '24px',
    },
  },
});
Atom SVG Icon

Atomic CSS

Styles are reused keeping CSS bundle is always minimal.

Eslint SVG Icon

Linting

Build-integrated oxlint validation. Detect typos before compiling.

Feather SVG Icon

Lghtweight

min + brotli 1 byte.
Before compression 0 byte.

⚡

Build-time Compilation

Eliminate styles compile to class names at built time.