Principios de Diseño
Grid de 24px
Sistema de espaciado matemáticamente armonioso. Divisible por 2, 3, 4, 6, 8, 12. Ritmo visual consistente en todo el sistema.
Sin Efectos
Cero gradientes. Cero sombras. Cero border-radius (excepto dots). Diseño plano absoluto. Funcionalismo extremo.
Tipografía Fuerte
IBM Plex Sans a 800/900 weight. JetBrains Mono para datos. Legibilidad máxima. Alto contraste.
Colores Semánticos
Verde (OK), Rojo (Error), Azul (Info), Ámbar (Warning). Sin decoración. Solo funcionales.
Denso, No Escaso
Máxima información visible. Tablas compactas. Sin whitespace excesivo. Respeto al tiempo del usuario.
Dark Mode
Soporte nativo con data-theme="dark". Toggle manual + prefers-color-scheme. Persistencia en localStorage.
Responsive
Breakpoints: 520px, 640px, 768px, 1024px. Mobile-first. Tablas horizontalmente scrollables.
Framework Compatible
Versiones para Tailwind y Bootstrap. Override automático de defaults. Fuerza el estilo plano.
Performance
13KB minified. Sin JavaScript requerido (excepto dark mode toggle). CSS puro. Load time visible.
Ejemplo de Uso
<!DOCTYPE html>
<html lang="es">
<head>
<link rel="stylesheet"
href="https://static.illanes00.cl/illanes/v3/illanes-manual.min.css">
</head>
<body>
<div class="topbar">
<div class="container">
<div class="brand-title">Mi Aplicación</div>
</div>
</div>
<main class="container">
<div class="card">
<div class="card-header">Estado del Sistema</div>
<div class="card-body">
<span class="dot ok"></span> Todos los servicios operativos
</div>
</div>
</main>
</body>
</html>Componentes
OK - Sistema operativo
Error - Fallo detectado
Warning - Atención requerida
Info - Información
200 OK
500 Error
429 Throttled
304 Not Modified
VPS-Dev
VPS-Control
VPS-Deploy
Comienza a Usar illanes Manual v3
Sistema de diseño completo con documentación exhaustiva, templates listos para usar, y compatibilidad con Tailwind y Bootstrap.
CDN: https://static.illanes00.cl/illanes/v3/illanes-manual.min.css
Templates Disponibles
Panel de administración completo con tabs, métricas, tablas de servicios y cards de VPS.
Monitoreo de servicios con health checks, systemd status y HTTP endpoints.
Página de documentación con sidebar navegable, breadcrumbs y code blocks.