2,480
+12.6%
Infraestructura CSS universal
Permitir que cada interfaz tengaRespuestas listas para usar
Gardener reúne CSS básico, componentes interactivos, recetas comerciales, adaptación de escritorio y manifiestos legibles por máquina en un solo sistema. Las personas pueden desarrollarse directamente y la IA puede seleccionarlo y usarlo con precisión sin tener que reorganizar el estilo cada vez.
- Cero dependencias de tiempo de ejecución
- Valor predeterminado neutro sobre fondo blanco
- Sistema de esquinas redondeadas pequeñas
- Compartir Web y Escritorio
94%
Montaje del sitio empresarial
42Tema de color
506Registrar componente
11,498Herramientas
52Receta de página legible por máquina
De un botón a súper CMS
Cubre átomos básicos, componentes comunes, backend de alta densidad, terminal móvil, comercialización de contenido, espacio de trabajo de IA y WebView de escritorio. El valor predeterminado es lo suficientemente restringido y la capacidad de combinación es lo suficientemente amplia.
Capa base completa
Restablecer, token, cuadrícula 24/12, tipografía, espaciado, tamaño, dirección lógica, color, borde, sombra, estado y clase de herramienta responsiva de cinco niveles.
Componentes listos para entregar
Los formularios, la navegación, las superposiciones, los datos, los medios, los negocios, las comunicaciones, el ámbito jurídico, el flujo de trabajo y el panel tienen estructuras estables y convenciones estatales.
Interacción nativa de IA
Flujo de mensajes, proceso de pensamiento, invocación de herramientas, aprobaciones, estado del agente, cronogramas, referencias, artefactos, selección de modelos y generación multimodal.
Recetas comerciales complejas
Inicio de sesión, categorías móviles, editor CMS, biblioteca multimedia, bandeja de entrada, administración de archivos, creación de formularios, listados de tiendas, facturación y configuración empresarial.
Adaptación de aplicación de escritorio
Tauri y Electron comparten la barra de título, el control de ventana, la barra de actividad, el área de edición, el inspector, las columnas y la barra de estado, y la interfaz del puente permanece segura.
La matriz de entorno está completa.
Claro, Oscuro, Sistema, Alto contraste, RTL, Movimiento reducido, Colores forzados, Impresión, Móvil, Tableta y Escritorio.
Enlaces oficiales de Vue 3 · 1.0.0 Estable
Todo el poder de CSS se ha convertido en la API de Vue
@gardener/vue Mapeo completo de 506 componentes y 66 comportamientos DOM, que proporciona complementos, componentes con seguridad de tipos, directivas, Composable, proveedor de temas de diez ejes, v-model, SSR y adaptación Tauri/Electron. Cada componente CSS tiene su propio G* Al exportar, AI puede seleccionar componentes directamente sin volver a ensamblar estilos.
506 componentes
538 exportaciones de tiempo de ejecución
29 puntos de entrada
28 paquetes CSS
Vue 3.4+
Aplicación.vueImportación bajo demanda · Tipo completo
<script setup lang="ts">
import { GButton, GCard, GardenerProvider } from "@gardener/vue";
import "@gardener/vue/style.css";
</script>
<template>
<GardenerProvider theme="garden" mode="light" shape="subtle">
<GCard>
<GButton variant="primary">Guardar</GButton>
</GCard>
</GardenerProvider>
</template>
Enlaces oficiales de React · 1.0.0 Estable
El mismo conjunto de CSS también tiene un modelo de componente React completo
@gardener/react Maps 506 CSS components and 66 DOM behaviors into a type-safe React API, providing precise native element types, ten-axis theme providers, controlled and uncontrolled value bridging, Imperative Handles, 7 Hooks, SSR / Hydration, and isolated Tauri / Electron adaptation entrances. Components, styles, and machine-readable directories maintain a one-to-one correspondence.
506 componentes
538 exportaciones de tiempo de ejecución
29 puntos de entrada
28 paquetes CSS
React 18.3–19.x
Aplicación.tsxImportación bajo demanda · Tipo completo
import { GButton, GCard, GardenerProvider } from "@gardener/react";
import "@gardener/react/style.css";
export function App() {
return (
<GardenerProvider theme="garden" mode="light" shape="subtle">
<GCard>
<GButton variant="primary">Guardar</GButton>
</GCard>
</GardenerProvider>
);
}
Enlaces oficiales de AngularJS · 1.0.0 Estable
Permitir que los grandes sistemas heredados de AngularJS sigan usando la API Gardener completa
@gardener/angularjs Asigna 506 componentes CSS y 66 comportamientos DOM a directivas de elementos/atributos de AngularJS, proporcionando fábrica de módulos, subconjunto de componentes estricto, ngModel nativo, tema de diez ejes, 3 servicios inyectables, ciclo de vida dinámico y entrada Tauri/Electron aislada. Se dirige a productos en stock que deben mantener AngularJS 1.8.x y expone explícitamente los límites de seguridad EOL del marco.
506 directivas
535 exportaciones de tiempo de ejecución
29 puntos de entrada
28 paquetes CSS
AngularJS 1.8.2–1.8.3
aplicación.jsFábrica de Módulos · ngModel · Tipo completo
import "angular/angular.js";
import { createGardenerAngularJS } from "@gardener/angularjs";
import "@gardener/angularjs/style.css";
const gardener = createGardenerAngularJS(window.angular, {
components: ["button", "input", "card"],
});
window.angular.module("app", [gardener]);
// <button g-button gardener-variant="primary">Guardar</button>
// <input g-input ng-model="vm.keyword">
Blazor RCL oficial · 1.0.0 Estable
De SSR estático a WebView de escritorio usando el mismo conjunto de componentes Razor
Gardener.Blazor Asigne 506 componentes CSS/híbridos, 66 comportamientos DOM y 75 eventos a la API Razor fuertemente tipada. Paquete estable con
net10.0 es la línea base, verificada net11.0
Consumo, que cubre escenarios de Blazor Web App, WebAssembly, Hybrid, Tauri y Electron, y preserva SSR, Forms, Accessibility y contratos temáticos de diez ejes.
506 componentes
66 comportamientos
75 eventos
43 activos estáticos
.NET 10/11
Tablero.razorRCL · SSR · Eventos fuertemente tipados
@using Gardener.Blazor.Components
<GardenerProvider Theme="garden" Mode="light"
Shape="small" Platform="desktop">
<GAppShell>
<GSidebar>Navegación</GSidebar>
<GMainRegion>
<GButton Variant="primary" @onclick="Save">
Guardar
</GButton>
</GMainRegion>
</GAppShell>
</GardenerProvider>División de columnas precisa, ya no es un cálculo temporal
24-grid cubre backend empresarial, CMS y formularios complejos, y 12-grid es compatible con borradores de diseño tradicionales. Hay interfaces estables para ancho de columna, desplazamiento, orden, líneas de cuadrícula, espaciado, consultas de contenedor, RTL e impresión.
Cinco niveles de respuesta de ventana gráfica + tres niveles de respuesta de contenedor480 / 768 / 1024 / 1280 / 1536px · CQ 480 / 768 / 1024px
Ver documento ráster completo
Esqueleto de página tradicional, también tiene interfaz estable
Desde las áreas principales superior e inferior, las columnas izquierda y derecha hasta el Santo Grial, Maestro/Detalle, Dock, columnas ajustables y espacio de trabajo de pantalla completa, web, terminales móviles y Tauri/Electron se pueden seleccionar directamente sin tener que escribir temporalmente CSS de diseño a nivel de página.
Superior / Principal / InferiorInicio/Principal/FinSanto GrialMaestro/DetalleLista/Detalle/InspectorEncabezado fijoBarra lateral fijaA un lado pegajosoPie de página fijoMuelleVista divididaPantalla completaÁrea segura móvilCarcasa de escritorioConsulta de contenedorRTL/Imprimir
16 tipos de esqueleto terminado + partes de área unificadaCapacidad de respuesta de la ventana gráfica · Capacidad de respuesta del contenedor · Dirección lógica · Acoplamiento de impresión · Mesa de trabajo de escritorio
Ver documentación completa del diseño de zonas
Deje que el espacio determine el diseño, no permita que los puntos de interrupción adivinen el diseño
Los patrones clásicos como Stack, Cluster, Sidebar, Switcher, Reel, Media Object, Masonry y Bento se han solidificado en interfaces de respuesta intrínsecas. La IA solo necesita elegir la intención y algunas variables, no es necesario reinventar las reglas Flex, Grid, desbordamiento y área segura.
PILA
ClústerEnvolturaEtiquetas
Repeler
M
Objeto multimediaMedios · Cuerpo · Acción
→
PilaClústerCentroBarra lateralConmutadorCubiertaCarreteMarcoObjeto multimediaAjuste automáticoAutocompletarSangradoRepelerImpostorSuperposiciónAlbañileríaBentoRelación de aspectoÁrea de desplazamientoAjuste de desplazamientoÁrea seguraRegión fija
22 primitivas estables + cero diseño de JavaScriptRespuesta intrínseca · Consulta de contenedor · RTL · Área segura · Movimiento reducido · Imprimir
Ver documentación primitiva completa
Estructura pública de página, ingresar directamente al estado de entrega
Unifique el encabezado de página, la barra de herramientas, la barra de comandos, el filtrado y las operaciones por lotes, y prepare completamente los estados de Carga, Vacío, Error, 403, 404, 500, fuera de línea y mantenimiento. Las páginas generadas por IA ya no son sólo "datos normales".
Espacio de trabajo de contenido
Gestión de páginas
Administrar contenido, estado y tiempos de publicación.
∅
Vacío
También hay pasos siguientes claros para el primer uso.
404
No encontrado
Reserva estable para enlaces no válidos.
⌁
Sin conexión
El estado de seguridad de los datos aún se informa cuando la red está desconectada.
Encabezado de páginaEncabezado de secciónSubtítuloBarra de herramientasBarra de accionesBarra de estadoBarra de comandosBarra de contextoBarra de filtroBarra de acciones masivasBarra de pie de páginaBarra de acción flotanteVolver al inicioDivisor con TextoAcciones fijasCargando páginaPágina vacíaError de página403404500Sin conexiónMantenimiento
23 estados de página completos y estructuras comunesConsulta de contenedor · Fija · Área segura · RTL · Tiempo de ejecución · Imprimir
Ver la documentación del componente en página completa
De un TIP a un circuito cerrado de ayuda completa
Información sobre herramientas, ventana emergente, llamada, preguntas frecuentes, centro de ayuda, recorrido, foco, sugerencias sobre nuevas funciones, solución de problemas y comentarios, todos utilizan interfaces estables. Cuando los usuarios encuentran preguntas en cualquier extremo, tienen expresiones apropiadas y consistentes.
Utilice el entorno de vista previa para confirmar el contenido antes de publicarlo en el entorno de producción.
- Abrir ayuda?
- Panel de comandoCtrl+K
ConsejoSugerencia en líneaTexto de ayudaActivador de ayudaInformación sobre herramientasInformación sobre herramientas enriquecidaVentana emergente de ayudaDefiniciónLlamadaNotaHacer/No hacerSugerencia claveLista de accesos directosTarjeta de ayudaPanel de ayudaCentro de ayudaTemas de ayudaPreguntas frecuentesAyuda contextualMarca Del EntrenadorVisita guiadaFocoPunto de accesoSugerencia sobre funcionesNovedadesLista de verificación de ayudaSolución de problemasComentarios de ayuda
28 modos de avisos, guía y soporteConsciente de colisión · Teclado · Restauración de enfoque · RTL · Movimiento reducido · Imprimir
Ver la documentación completa del sistema de ayuda
Los formularios ya no comienzan con un montón de entradas
Se combinan campos, particiones, diseño horizontal y en línea, búsqueda/contraseña/recuento, grupos seleccionados, validación, nombre/dirección/monto, condiciones y repetibles, revisión y envío de acciones. La IA solo necesita seleccionar la intención comercial y no tiene que organizar el formulario CSS una y otra vez.
FormularioSección de formularioCampoConjunto de camposFila del formularioCuadrícula de formularioFormulario HorizontalFormulario en líneaForma compactaGrupo de entradaAfijo de entradaCampo de búsquedaCampo de contraseñaCampo borrableContador de caracteresEstado de validaciónResumen de validaciónGrupo de casillas de verificaciónGrupo de radioFila de interruptoresTarjetas de elecciónNombre GrupoGrupo de direccionesGrupo telefónicoGrupo MonetarioRango de fechasRango de tiempoCampo de unidadCampo de rangoCampo de archivoCampo repetibleCampo condicionalAcciones de formularioEstado de guardado automáticoProgreso del formularioRevisión de formularioGrupo de consentimiento
37 estructuras de formas tradicionales + 5 tipos de comportamientos interactivosConsulta de Contenedor · Validación · Grupos Empresariales · RTL · Área Segura · Imprimir
Ver documentación de combinación de formato completo
Los datos no solo deben mostrarse, sino que deben estar disponibles de inmediato
48 modos de datos que cubren tablas, registros, listas, jerarquías, indicadores, planes, mapas y operaciones. Hay un tiempo de ejecución unificado para ordenar, seleccionar, expandir, administrar columnas, filtrar y cambiar de vista.
Ingresos del cliente¥286K
128Activo
6Riesgo
Seleccionado 0 elemento
| Estado | Operación | |||
|---|---|---|---|---|
| Tecnología Galaxia | Activo | ¥128,000 | ||
|
Clientes de Enterprise Edition · Último contacto hace 2 días
|
||||
| Diseño Yuanshan | Se realizará un seguimiento | ¥86,000 | Ver | |
| Educación en Linhai | Riesgo | ¥42,000 | Ver | |
TablaTabla ResponsivaCuadrícula de datosCuadrícula editableMesa de árbolTabla agrupadaMesa expandibleComparaciónPivoteLista de descripcionesValor claveDetalle del registroListar grupoLista de mediosLista densaLista virtualÁrbolLínea de tiempoFeed de actividadesRegistro de auditoríaKPILista de estadísticasTarjeta MétricaMinigráficoEstadísticas de progresoGráficoLeyendaClasificaciónResumen de estadoCalendarioAgendaKanbanGanttOrganigramaMapaMatrizMapa de calorBarra de herramientas de datosSelector de columnasVistas guardadasPanel de exportaciónEstado de los datosConmutador de vistasResumen de selecciónDensidadResumen de filtrosGenerador de clasificaciónInspector de datos
48 modos de operación y visualización de datos + 8 tipos de interacciones de reutilizaciónTabla · Registro · Métrica · Planificación · Espacial · Teclado · RTL · Imprimir
Ver documento completo de combinación de datos
De seleccionar un elemento a procesar 100.000 registros
Seleccionar todo, invertir selección, selección de rango, barra de herramientas por lotes, transferencia, selección de árbol y cascada, selector de personas/organización/recurso/medios, rango de fecha y hora, guardar configuración y ordenar/generador de grupos tienen interfaces estables. La IA no tiene que improvisar complejos procesos de selección de backend.
Control de selecciónSeleccionar TodoInvertirRangoBarra de herramientas por lotesAlcance de la selecciónTransferenciaLista dualSelección de árbolCascadaSelector de mencionesSelector de usuariosSelector de organizacionesSelector de recursosSelector de mediosSelector de iconosSelector de colorRango de fechasRango de tiempoFiltros guardadosVistas guardadasSelector de columnasGenerador de clasificaciónGenerador de gruposSelector de entidadesSelector de etiquetasSelector de relacionesConfirmación masivaProgreso masivoPanel selectorResumen del selectorResumen de selección
32 selecciones interactúan con modo por lotes + 7 categorías de multiplexaciónSelección múltiple · Jerarquía · Buscar · Área segura · Teclado · RTL · Imprimir
Ver documentación completa de componentes seleccionados
Desde subir un archivo hasta completar toda la producción del contenido
Cola de carga, exploración de archivos, biblioteca multimedia, procesamiento de imágenes, visualización de documentos/PDF/audio y video, edición de código y texto enriquecido, Markdown, bloques, revisiones, comentarios y guardado automático tienen estructuras listas para usar.
Manual de Marca Corporativa.pdf
Portada de la página de inicio.jpg
PDF
Manual de Marca.pdf
IMG
Portada de la página de inicio.jpg
Entrega de archivosLista de archivosCola de cargaCarga de fragmentosProgreso de la cargaError al cargarTarjeta de archivoÁrbol de carpetasExplorador de archivosVista previa de archivoBiblioteca multimediaCuadrícula de mediosDetalles de mediosRecorte de imagenAnotación de imagenVisor de documentosVisor de PDFReproductor de vídeoReproductor de audioEditor de códigoEditor de texto enriquecidoEditor de rebajasEditor de bloquesComparación de revisionesAutoguardadoEsquema de contenidoBarra de herramientas del editorBuscar y reemplazarHilo de comentariosHistorial de versionesPropiedades del archivoMedidor de almacenamiento
32 modos de archivos y contenidos + 6 tipos de interacciones de reutilizaciónCargar · Navegador · Editor · Revisión · Teclado · RTL · Imprimir
Ver la documentación completa del sistema
Desde el primer inicio de sesión hasta cada auditoría de seguridad
El inicio de sesión, el registro, la verificación, la MFA, la clave de acceso, el SSO, el código QR, la invitación, la selección de cuenta e inquilino, la pantalla de bloqueo, la recuperación de sesión, la administración de dispositivos y los eventos de seguridad se han combinado en una estructura de página estable adecuada para sitios web, terminales móviles, Dashboard y Tauri/Electron.
Ingrese el código de verificación enviado al +86 138****6608
Nuevo dispositivo detectado
Linux · Firefox, lanzado desde Beijing.
Autenticación centradaAutenticación divididaIniciar sesiónRegistroRecuperación de contraseñaRestablecimiento de contraseñaVerificación por correo electrónicoVerificación telefónicaAMFOTPClave de accesoSSOInicio de sesión QREnlace MágicoInvitaciónPrimera configuraciónPantalla de bloqueoSesión vencidaSelector de cuentasSelector de inquilinosConmutador de identidadConfiguración de perfilSeguridad de la cuentaDispositivosActividad de inicio de sesiónAlerta de seguridadCódigos de recuperaciónDispositivo confiableCuentas conectadasSeguridad de la contraseñaConsentimientoResultado de autenticación
32 modos de inicio de sesión y cuenta + 8 tipos de interacciones de reutilizaciónContraseña · OTP · MFA · Clave de acceso · SSO · Sesión · Identidad · Seguridad
Ver documentos completos del sistema de cuentas
Desde ver el producto hasta completar la transacción y reembolso
Tarjeta de producto, detalles, SKU, carrito de compras, pago, dirección, envío, oferta, factura, pago, pedido, suscripción, uso, facturación y reembolso se han convertido en estructuras estables. Adecuado para comercio electrónico, productos digitales, SaaS, adquisiciones empresariales, comercialización de CMS y clientes de escritorio.
Edición empresarialGardener Studio
Suite empresarial Estudio
¥699¥899-22%
Plataforma
GRAMO
Suite empresarial EstudioWindows · Licencias empresariales
¥699.00
El carrito de compras está vacío
Producto
Descuento
Entrega
Hacer frente
Tarjeta de productoLista de productosDetalle del productoGalería de productosSelector de SKUCantidad por pasosVisualización de preciosArtículo del carritoCarritoMinicarroResumen del carritoPagarPasos para realizar la compraSelector de direccionesTarjeta de direcciónMétodo de envíoSelector de recogidaCupónLista de ascensosInformación de facturaMétodo de pagoHoja de pagosResultado del pagoResumen de pedidosCronograma de pedidosDetalle del pedidoPlan de suscripciónComparación de preciosMedidor de usoHistorial de facturaciónEstado del reembolsoResumen de impuestos
32 modelos de negocio y pago + 7 tipos de interacciones de reutilizaciónCatálogo · Carrito · Realizar Pedido · Cumplimiento · Pago · Pedido · Facturación
Ver documentos comerciales y de pago completos
No es una computadora de escritorio más pequeña, sino una capa de aplicación móvil completa
Área segura, ventana gráfica dinámica, barra superior, navegación inferior, hoja inferior/acción/filtro, extracción para actualizar, carga infinita, operación deslizante, selección de rueda, evitación de teclado, autenticación y liquidación móvil, permisos y estado fuera de línea tienen contratos estables y se pueden usar directamente para páginas web móviles, PWA y WebView móvil Tauri/Electron.
Centro de contenido
Protección automática del indicador de inicio y muesca.
Estructura accionaria de PWA, Tauri y Electron.
Transmisión de contenido móvil
Ranuras de acción para medios estables, cuerpo y cola.
Shell de área seguraBarra superior de aplicacionesNavegación inferiorSábana InferiorHoja de acciónTirar para actualizarCarga InfinitaAcciones de deslizamientoPestañas deslizablesCategoría MóvilFiltro MóvilBarra de compra fijaBúsqueda MóvilSelector móvilSelector de ruedasBotón de acción flotanteDiálogo de pantalla completaEvitación del tecladoSugerencia de gestoBanner sin conexiónControl segmentadoTransmisión móvilCarrusel de tarjetasFormulario MóvilAutenticación móvilPago móvilVisor de mediosBarra de herramientas del tecladoModo de selecciónCafeteríaSolicitud de permisoEstado vacío/error
32 modos específicos de dispositivos móviles + 14 tipos de interacciones de reutilizaciónÁrea segura · Toque · Hojas · Gesto · Teclado · PWA · WebView
Ver documentación móvil completa
Convierta la tecnología web en un completo espacio de trabajo de escritorio
Las barras de título, botones de ventana, menús y barras de actividad nativos son solo el punto de partida; Las etiquetas de los documentos, las columnas ajustables, el Dock, el inspector, el panel de comandos, la selección de archivos, la bandeja, las ventanas múltiples, las tareas en segundo plano, las actualizaciones, los permisos y la recuperación ante fallos se han combinado de manera estable y se pueden implementar directamente en Tauri y Electron.
CMS de escritorio
No es necesario volver a ensamblar para espacios de trabajo de alta densidad
La ventana Chrome, la navegación, el área de edición, el área de estado y el puente de host tienen contratos independientes.
Barra de título nativaControles de ventanaBarra de menúBarra de actividadesPanel de acoplamientoPanel dividido redimensionableInspectorBarra de estadoPaleta de comandosGrabador de accesos directosMenú contextualPestañas no guardadasRegión de arrastreCarga de ventanaActualización disponibleSolicitud de permisoSelector de archivos nativoMenú BandejaVentana múltipleEspacio de trabajo de escritorioConmutador de ventanaDocumentos recientesBarra de herramientas del escritorioPanel InferiorTareas en segundo planoCentro de notificacionesEstado de sincronizaciónProgreso de la actualizaciónRecuperación tras falloInstancia únicaEnlace profundoDiálogo Acerca de
32 modos específicos de escritorio + 11 tipos de interacciones reutilizablesTauri · Electron · Window Chrome · Espacio de trabajo · Native Bridge · Ciclo de vida
Ver la documentación de escritorio completa
La interacción con IA no es un cuadro de chat
Además del diálogo, también se requieren respuestas del compositor y de transmisión, resumen de razonamiento, invocación y aprobación de herramientas, orquestación de múltiples agentes, cita de fuentes, artefacto, memoria contextual, token/tarifa, voz, permisos, privacidad, revisión de seguridad y evaluación de comentarios. Gardener convierte toda la cadena de tareas de IA en 32 modos que se pueden reutilizar directamente.
Generar la página de inicio del portal empresarial para Super CMS.
Receta de Enterprise Portal seleccionada, verificación de componentes y permisos.
Panel de control, CMS, permisos y espacios de trabajo de escritorio coincidentes.
¿Permitir escribir en la plantilla de página?
Modificar solo el directorio generado del proyecto actual.
Espacio de trabajo de IALista de conversacionesTema de conversaciónMensaje de IACompositor de mensajesAdjuntoArrancador rápidoBiblioteca de mensajesMención / Menú de barra diagonalSelector de modeloPensandoRespuesta de transmisiónLlamada a herramientaAprobación de herramientaEstado del agentePlan de agenteTablero multiagenteTraspaso de agenteFuentes / CitasEspacio de trabajo de artefactosPanel de artefactosÁrbol de archivos AIHistorial de versionesGalería de GeneraciónMarcador de posición de generaciónContexto/MemoriaLímite de costo/tarifaSesión de vozAlcance del permisoAviso de privacidadAviso de seguridadComentarios/Evaluación
32 modos nativos de IA + 9 tipos de tiempo de ejecuciónChat · Multimodal · Herramientas · Agentes · Artefactos · Contexto · Seguridad · Evaluación
Ver la documentación completa del componente de IA
Desde la biblioteca de componentes, vaya a la página completa que se puede generar directamente
La categoría 16 solidifica sitios web públicos, contenido personal, backends empresariales, banco de trabajo empresarial y portales industriales verticales en 32 contratos de página completa. La IA primero selecciona el tipo de página y luego completa los componentes y el contenido empresarial. Ya no inventa temporalmente encabezado, navegación, área principal, área lateral y reglas plegables móviles.
Descripción general de la empresa
Descripción general del funcionamiento del Súper CMS
El mismo contrato de página completa puede cambiar temas comerciales, personales, médicos, financieros o de servicios públicos.
Sitio publicado28,640↑ 12.4%
Plantilla de página486k32 entradas de página completa
Pendiente de revisión138Necesita procesamiento
Aterrizaje del ProductoCasa corporativaHogar personalPortafolioÍndice de blogsArtículoPortal de documentosCentro de ayudaResultados de la búsquedaContactoPreciosPanel de controlLista de administradoresDetalle del registroConfiguraciónCentro de usuariosNotificacionesIncorporaciónCRMEspacio de trabajo del proyectoCentro de soporteCentro de aprobaciónBase de conocimientosPortal de aprendizajePortal de eventosPortal de ReservasAtención médicaFinanzasServicio PúblicoMercadoComunidadCentro de estado
32 modos de página completa + 52 recetas legibles por máquinaPersonal · Empresa · Contenido · Operaciones · Industria · Multiplataforma
Ver el documento completo de la solución
42 temas de colores
Cambiar la marca pero no los componentes
Los temas de color se combinan ortogonalmente con neutros, fuentes, formas, densidades, capas, animaciones, plataformas y sistemas operativos. La interfaz de blanco y luz siempre se mantiene aquí y solo se cambia el color de la marca principal.
Primario
Transparente sin ser demasiado decorativo
Los botones, enlaces, focos y estados seleccionados siguen automáticamente el tema.
Teclado operable; cada tema ofrece entre 50 y 950 gradaciones de color completas y colores de primer plano legibles de forma independiente.
Autoría predecible · Estable 1.0.0
HTML es la interfaz
unificado
g-
Prefijos, denominación de componentes estables y declarativos
data-g-* Comportamientos que tanto los humanos como la IA pueden comprender rápidamente.
- Importar por capaNúcleo/Temas/Utilidades/Componentes/IA
- Tiempo de ejecución declarativoInicialización automática y observación DOM dinámica
- Legible por máquinaAPI pública, componentes, clases de herramientas, recetas y lista de capacidades
- Verificación estrictaOnce conjuntos de esquemas cerrados, 48 casos de uso de esquema estándar, 10 casos de uso específicos de compilación, 66 pruebas unitarias de tiempo de ejecución, 125 casos de uso de navegador real y 24 casos de uso estructurales
índice.html
<html data-g-theme="garden" data-g-mode="light">
<link rel="stylesheet" href="gardener.css">
<main class="g-dashboard">
<article class="g-card g-p-5">...</article>
</main>
<script type="module" src="gardener.runtime.js"></script>
</html>Entregar solo las plataformas y componentes realmente necesarios para la página actual
5 archivos de plataforma, 28 paquetes de componentes estables y 506 asignaciones de propiedad de componentes permiten a los desarrolladores y a la IA seleccionar directamente productos oficiales sin desensamblar CSS temporalmente. La compresión a nivel de sintaxis, el mapa fuente, la integridad SHA-256/SRI, las compilaciones reproducibles, la tipificación de TypeScript, las líneas base de compatibilidad entre versiones y la activación del paquete de lanzamiento se entregan con la compilación.
Archivo de plataforma
Web, Móvil, Escritorio, Tauri y Electron conservan automáticamente las capacidades finales correspondientes.
Paquete de componentes
El diseño, los formularios, la navegación, los datos, el contenido, las cuentas, el comercio, los dispositivos móviles, el escritorio y la IA se pueden introducir de forma independiente.
Propiedad del componente
Cada componente público se resuelve en el paquete completo al que pertenece, con inclusiones explícitas enumeradas.
Presupuesto de producto dual
El límite superior absoluto de raw, gzip, Brotli y el crecimiento de referencia 0.9.0 bloqueará la publicación si alguno excede el límite.
Línea base compatible
Solo se pueden agregar entradas, temas, tiempos de ejecución, componentes y recetas; las eliminaciones deben pasar primero el período de obsolescencia de al menos dos versiones menores.
npm run build:platform -- --platform mobile --out dist/custom/mobile-app
npm run build:custom -- --components button,card,dialog --out dist/custom/account-ui
npm run verify:reproducible
npm run verify:compatibility
npm run test:types
npm run verify:package
npm run budgetCada página debe resistir el entorno real
Ejecuta 125 casos de uso de navegador real y 24 casos de uso de estructura HTML de forma predeterminada; La configuración completa cubre tres motores de escritorio, retratos de dispositivos Android/iPhone y comprobaciones automáticas WCAG.
Multinavegador de escritorio
Chromium y WebKit ingresan al control de acceso predeterminado; Firefox proporciona control de acceso completo independiente y de tres motores.
Dispositivo móvil
Pixel 7 y iPhone 13 están completamente cubiertos con 21 muestras y dos páginas de inicio, y comprueban pantalla estrecha de 320 píxeles, pantalla horizontal, reflujo y objetivo táctil de 44 píxeles.
Accesibilidad
Axe WCAG 2 A/AA Todas las infracciones automáticas ponen a cero y cubren la recuperación de enfoque y teclado, RTL, movimiento reducido, colores forzados.
Integridad estructural
Los 21 ejemplos, página de inicio y análisis de verificación de documentos, ID, referencia ARIA, título y ventana gráfica.
El mismo idioma cubre todos los terminales
La estructura de la página, el token del tema y la semántica de interacción son consistentes y solo se agregan las adaptaciones necesarias de densidad, ventana y zona segura en cada extremo.
Sitio web para PC
Sitio web empresarial, portal, sitio web de contenidos, comercio electrónico y SaaS.
Web móvil/PWA
Área segura, densidad táctil, navegación inferior y página de categorías.
Panel de control
Datos, tablas, filtros y aplicaciones de varias columnas de alta densidad.
Tauri/Electron
Barra de título del escritorio, puente de ventanas y diseño del banco de trabajo.
Productos de IA
Transmisión de mensajes, herramientas, agentes, artefactos y estados de compilación.
No es necesario volver a ensamblar las páginas de alta frecuencia
Se han combinado páginas complejas pero altamente reutilizables en recetas. La IA debe elegir primero las recetas y luego hacer ajustes limitados utilizando componentes y clases de herramientas.
Inicio de sesión empresarialSSO · MFA · Clave de accesoClasificación de móvilesToque · Área Segura · Doble ColumnaCMS de escritorioÁrbol · Lienzo · InspectorEspacio de trabajo de IAChat · Herramientas · ArtefactoAntecedentes del análisisKPI · Gráfico · Tabla de datosAdministrador de archivosDirectorio · Cuadrícula · Cola de cargaProductos básicos y liquidaciónDetalles · Carrito de Compras · PedidoInformes y FacturasPantalla · PDF · Imprimir
Deja que la IA elija, no dejes que la IA adivine
La lista de cinco categorías de API pública, componentes, clases de herramientas, recetas y capacidades de la industria expone los nombres, entradas, plataformas, estados y condiciones de respuesta permitidos de manera estructurada. El proceso de generación de páginas se puede restringir, verificar y reproducir.
Identificación de la intención de la página
Tipo de extremo, categoría de negocio, densidad, volumen de contenido y complejidad de interacción.
Priorizar la selección de recetas
Seleccione el esqueleto de página más cercano entre 52 estructuras terminadas.
Combinación de componentes y herramientas
Utilice únicamente API públicas, clases y comportamientos que realmente existan en el manifiesto.
Verificar contrato y entorno
Aprobar comprobaciones de esquema, teclado, accesibilidad, RTL, impresión y puntos finales de respuesta.
Comience con un sistema completo.
Deje de reinventar la infraestructura para la página siguiente.