·structural-grid
$

structural-grid

Sistema de diseño de cuadrícula estructural (cuadrícula expuesta/diseño de rieles) para páginas de destino SaaS modernas. Úselo al crear sitios de marketing, páginas de destino o páginas de productos SaaS con temas oscuros inspirados en Linear, Vercel, Resend y Planetscale. Proporciona bases de CSS, patrones de sección, recetas de componentes y lógica de borde receptiva para la estética de la cuadrícula visible.

8Instalaciones·0Tendencia·@nabinkhair42

Instalación

$npx skills add https://github.com/nabinkhair42/structural-grid-skill --skill structural-grid

Cómo instalar structural-grid

Instala rápidamente el skill de IA structural-grid en tu entorno de desarrollo mediante línea de comandos

  1. Abrir Terminal: Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.)
  2. Ejecutar comando de instalación: Copia y ejecuta este comando: npx skills add https://github.com/nabinkhair42/structural-grid-skill --skill structural-grid
  3. Verificar instalación: Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw

Fuente: nabinkhair42/structural-grid-skill.

SKILL.md

Ver original

You are implementing a Structural Grid (also called "Exposed Grid" or "Rail Layout") design pattern. This is the modern SaaS design pattern used by Linear, Vercel, Resend, Profound, and Planetscale — where the underlying page grid is promoted to a first-class visual element.

Add these to your global CSS. All measurements derive from a single --rail-offset variable.

Always use overflow-x: clip on .page-rails, NEVER overflow-x: hidden. hidden creates a new scroll container which breaks position: sticky on any descendant. clip clips overflow visually without affecting scroll/sticky behavior.

Sistema de diseño de cuadrícula estructural (cuadrícula expuesta/diseño de rieles) para páginas de destino SaaS modernas. Úselo al crear sitios de marketing, páginas de destino o páginas de productos SaaS con temas oscuros inspirados en Linear, Vercel, Resend y Planetscale. Proporciona bases de CSS, patrones de sección, recetas de componentes y lógica de borde receptiva para la estética de la cuadrícula visible. Fuente: nabinkhair42/structural-grid-skill.

Datos (listos para citar)

Campos y comandos estables para citas de IA/búsqueda.

Comando de instalación
npx skills add https://github.com/nabinkhair42/structural-grid-skill --skill structural-grid
Categoría
$Marketing
Verificado
Primera vez visto
2026-02-24
Actualizado
2026-03-11

Browse more skills from nabinkhair42/structural-grid-skill

Respuestas rápidas

¿Qué es structural-grid?

Sistema de diseño de cuadrícula estructural (cuadrícula expuesta/diseño de rieles) para páginas de destino SaaS modernas. Úselo al crear sitios de marketing, páginas de destino o páginas de productos SaaS con temas oscuros inspirados en Linear, Vercel, Resend y Planetscale. Proporciona bases de CSS, patrones de sección, recetas de componentes y lógica de borde receptiva para la estética de la cuadrícula visible. Fuente: nabinkhair42/structural-grid-skill.

¿Cómo instalo structural-grid?

Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/nabinkhair42/structural-grid-skill --skill structural-grid Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw

¿Dónde está el repositorio de origen?

https://github.com/nabinkhair42/structural-grid-skill

Detalles

Categoría
$Marketing
Fuente
skills.sh
Primera vez visto
2026-02-24

Skills Relacionados

Ninguno