open-design-landing

Compose an Atelier Zero landing page from a brand brief and 16 image slots.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/LucasOl1337/simple-ai --skill open-design-landing
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: open-design-landing
Source: https://github.com/LucasOl1337/simple-ai/tree/main/DesignTemplates/embedded/open-design/skills/open-design-landing
Command: npx skills add https://github.com/LucasOl1337/simple-ai --skill open-design-landing

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and assets (resource) components.

What problem does it solve?

Open-design-landing provides a parameterized workflow to generate world-class editorial landing pages using the Atelier Zero design system, reducing manual HTML/CSS work and ensuring brand-consistent visuals.

Core Features & Use Cases

  • Parameterized inputs drive a complete single-page site with a reusable design language.
  • Emits a self-contained HTML render with inline CSS and scripts, plus an optional mirror of Astro-based deployables.
  • Manages 16 collage image slots with placeholders or generated assets via a manifest for deterministic rendering.
  • Suitable for marketing pages, brand campaigns, OSS project sites, and product landing experiences.

Quick Start

Provide an inputs.json and run the composer to generate a self-contained landing page.

Frequently Asked Questions about open-design-landing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a landing page from a brand brief using a design system?

Generate a landing page by providing a brand brief and an inputs.json file to a parameter-driven workflow. The composer outputs a self-contained HTML page with inlined CSS and scripts, enforcing design system tokens.

What is a parameter-driven editorial landing page workflow?

A parameter-driven editorial landing page workflow uses inputs like a brand brief and image manifests to compose a complete site. It enforces design system tokens to ensure brand-consistent visuals without manual HTML or CSS work.

Can I use placeholder images for landing page generation?

Yes, you can use placeholder images for landing page generation. The workflow manages 16 collage image slots and supports either placeholders or generated assets via a manifest for deterministic visual rendering.

Does this landing page generator support Astro deployment?

Yes, the landing page generator supports Astro deployment. It can mirror a deployable Astro surface for marketing or OSS branding, alongside emitting a self-contained HTML render with inline scripts.

Do I need to write manual CSS for an Atelier Zero landing page?

No, you do not need to write manual CSS for an Atelier Zero landing page. The workflow enforces the design system tokens automatically and outputs self-contained HTML with inlined CSS.

What are the limitations of using a single-page HTML generator for marketing campaigns?

A limitation of this single-page HTML generator is that it produces a self-contained landing page rather than a multi-page application. It relies on a fixed 16 image slot manifest for deterministic rendering.