PALLAS

Sobre el sistema

Creado a partir de

La web PALLAS

Componentes

52 en 7 grupos, con todos sus estados

Tipografías

Geist, Geist Mono

Mostrador

El mostrador del depósito tiene horario; la línea de averías nunca cierra. Abierto, cada llamada es un cartel blanco encendido. Fuera de horario, los carteles que dependen del mostrador se apagan hasta quedar en un filete, la línea nocturna se enciende en sodio con una baliza más rápida y cambian con ella los estados, los pies de foto y la placa de la navegación. Puede seguir el reloj por sí solo.

Formato

HTML, CSS y JavaScript sin dependencias, más DESIGN.md

Versión

1.0

• Night#060910
• Cab#0B1019
• Steel#121926
• Ink#EEF1F6
• Plate#F4F6FA
• Sodium#FFB547
• Sodium deep#E08A12
• Fault#FF7A6B

En contexto

Una página de línea de máquinas para plataformas articuladas, con tarifas y una solicitud que se imprime a medida que respondes. Se incluye como página base, lista para cambiarle el nombre.

En el kit

DESIGN.md

Las reglas para construir con el sistema, escritas para pasárselas a Claude, a Lovable o a un desarrollador

tokens/tokens.json

Cada color, tamaño, espacio y tiempo como tokens con nombre

tokens/tokens.css

Los mismos tokens como variables CSS, con la sala iluminada

css/pallas.css

Todos los componentes y sus estados, con el mostrador abierto y fuera de horario

js/pallas.js

Mostrador y relojes, escenas, pestañas, listas de opciones, el remito, el buscador, diálogos, avisos y la navegación. Sin dependencias

components.html

Cada componente en cada estado, uno al lado del otro

starter/index.html

Una página de línea de máquinas con tarifas y una solicitud en vivo, hecha solo con el sistema

assets/imagery/

Fotografías de turno de noche, sala iluminada y catálogo a resolución completa

LICENSE.md

Uso comercial en tus proyectos y en los de tus clientes

Construir con una IA

1. Adjunta DESIGN.md

   Añádelo a tu conversación en Claude, Lovable o cualquier herramienta de IA.

2. Describe tu página

   Con tus palabras, tu marca y tu contenido.

3. Quédate con el código o llévalo a otro stack

   Enlaza el CSS de tokens y componentes, o pide React. Las reglas se mantienen igual.

Componentes

Estructura

Full-bleed scene, Shot timeline, Twelve-column grid, Hairline rows, Figure row, Lit room

Acciones

Plate, Switched-off plate, Night line plate, Call row, Icon button, Text link, Finder field

Entrada

Text field, Select, Long text, Unit field, Range, Option list, Checkbox, Beacon radio, Switch, Quantity, Filter chips

Datos

Index bars, Word tabs, Spec row, Counter, Rates table, Request manifest, Lift ruler

Indicadores

Desk status, Clock, Tag, Notice, Subtitle, Progress, Step rail, Toast, Stamp

Contenido

Scene slider, Tall panel, Catalogue tile, Case, Result row

Capas y navegación

Dialog, Finder drawer, Navigation bar, Drop sheet, Mobile menu, Mobile bar, Footer wordmark