huashu-pentagram-grid

Generate Swiss-grid HTML presentation decks for marketing and go-to-market strategy planning.

93.2k|10.8k|Updated Apr 28, 2026

Search Tags:#HTML #presentation #Marketing #deck #gTM #Slides #swiss-grid

One-click install

npx skills add https://github.com/nexu-io/open-design --skill huashu-pentagram-grid

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: huashu-pentagram-grid
Source: https://github.com/nexu-io/open-design/tree/main/plugins/_official/examples/huashu-pentagram-grid
Command: npx skills add https://github.com/nexu-io/open-design --skill huashu-pentagram-grid

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill addresses the difficulty of creating consistent, high-quality, and data-driven marketing decks that maintain a strict visual identity without requiring complex design software.

Core Features & Use Cases

Swiss-Grid Layouts: Provides a rigid, professional visual system based on 1920x1080 HTML canvases.
Data-Driven Storytelling: Includes specialized components for bar charts, summary strips, and hero numerals to present marketing metrics effectively.
Use Case: A marketing team needs to present a quarterly GTM strategy. This Skill generates a multi-section, browser-ready HTML deck that ensures all slides adhere to the brand's specific typography, color palette, and grid discipline.

Quick Start

Generate a 10-page marketing GTM deck using the huashu-pentagram-grid template with the topic 'Q3 Growth Strategy'.

Frequently Asked Questions about huashu-pentagram-grid

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

FAQPage Schema

How do I create a new deck with this template?▼

Copy the example.html file, update the content within the slide sections, and ensure you maintain the existing CSS grid structure and design tokens to preserve the visual identity.

Can I change the colors in the deck?▼

You can re-theme the deck by modifying the values of the CSS variables defined in the :root block, but you must maintain the single-accent color constraint to adhere to the design system.

Does this deck require external dependencies?▼

No, the deck is designed with zero external dependencies. It uses standard HTML, CSS, and JavaScript, ensuring it runs locally in any modern web browser without a build step.

How do I ensure my deck remains responsive?▼

The deck uses a fixed 1920x1080 stage with a JavaScript fit() function that scales the content based on the viewport size, ensuring consistent rendering across different screen resolutions.