.jos Open Standard v0.0.7

The Next Generation Design System

KRMEN is an AI-powered fractal design system where every layer is an intention-driven artifact. Build stunning interfaces with self-describing units, automated SEO, and real-time guardian protection.

See 6 Layers
100/100 PageSpeed
6 Fractal Layers
Scalability
Complete Feature List

Everything You Need

Fractal Architecture

  • L0 Foundations - 8px Unit-K grid system
  • L1 Backgrounds - Canvas behaviors
  • L2 Decorations - Glassmorphism, neon-strokes
  • L3 General UI - Cards, Lists, Menus
  • L4 Intelligence - MAGIC Kernel, AI agents
  • L5 FX - Particles, bloom, seasonal effects

AI-Powered

  • JOSFOX Shield - Proactive protection
  • Foxtana AI - UI debugging & optimization
  • HEFESTO - Component scaffolding
  • Collision detection & auto-merge
  • Theme generation via prompts
  • Seasonal variant automation

Performance

  • 100/100 Lighthouse scores enforced
  • LCP < 1.2s guaranteed
  • CLS = 0 via reserved space
  • Auto WebP/AVIF conversion
  • Critical CSS inlining
  • JS budget enforcement (15KB)

Developer Experience

  • .jos Open Standard format
  • SHA-256 integrity checks
  • Auto-documentation generation
  • Pre-commit hooks
  • Design token registry
  • Admin/Public view portability
Hard Evidence

The 6 Fractal Layers

Toggle each layer to see KRMEN's architecture in action.

L0: Foundations
L1: Backgrounds
L2: Decorations
L3: General UI
L4: Intelligence
L5: FX
🦊

Layer Info

Toggle a layer to see its description.

Kernel:
AI-Powered

Customize with AI

Let Foxtana generate themes, effects, and components for you.

Theme Switcher

L5 Effects

Hero Generator

SISTEMA DE DISEÑO · JOSFOX

Explora KRMEN.

Un sistema de diseño vivo basado en el estándar abierto .jos

Hard Evidence

Create Your Design System

Generate a complete design system from any source.

Upload Image

Mockup, screenshot, or design file

Paste HTML

Existing page or component code

Enter URL

Analyze any public webpage

Only public CSS/HTML analyzed. No data stored.
Customize

Build Custom Components

Select a template and customize for your brand.

Vacation Rental Carousel

Slider with property cards, photos, and booking CTAs

📅 Check-in → Check-out
👥 Guests
Reserve Now

Booking Widget

Date picker, guest selector, and reservation form

Live Demo

Extracted from josfox.cloud

Real components extracted using KRMEN's design system parser.

Header Component
--bg: #050608; --primary: #3b82f6;
Hero Section
Alpha Cerrada · Solo Invitación

Tecnología de Clase Mundial

Diseñado para CEOs, pensando en resolver necesidades.

--gold: #fbbf24; --text-muted: #9ca3af;
Bento Card

Mínimo esfuerzo

Valor Máximo

border-radius: 24px;
Foxtana Widget
🦊
Foxtana AI

Lenguaje de negocios

--accent: #8b5cf6;
Performance Proof

100/100 Guaranteed

JOSFOX Shield enforces perfect Lighthouse scores.

100 Performance
100 Accessibility
100 SEO
100 Best Practices
1.1s LCP Target: < 1.2s
0 CLS Target: 0
45ms FID Target: < 100ms
0ms TBT Target: < 200ms
Guardian Active
  • All images WebP/AVIF
  • Critical CSS inlined
  • JS budget: 12KB / 15KB
  • DOM depth: 4 / 5 max
  • Contrast ratio: 7.2:1
  • JSON-LD schema present
AI Agents

Meet the Team

JOSFOX Shield

Proactive Protector

  • Folder scanning
  • Collision detection
  • Asset optimization
  • 100/100 enforcement
🦊

Foxtana AI

Reactive Problem Solver

  • UI debugging
  • SEO optimization
  • Theme generation
  • Code suggestions

HEFESTO

Creation Engine

  • Component scaffolding
  • Module generation
  • Static automation
  • Legacy transform

Ready to Build?

Start creating stunning interfaces with the KRMEN Fractal Design System.

View on GitHub
Toggle layers, themes, and effects!
🦊 Foxtana AI
Hola! 👋 I'm Foxtana, your AI design assistant. Try asking me to change the theme or toggle effects!