static-web-artifacts-builder

To build high-density static infographic artifacts, follow these steps:

Stack: Vanilla HTML5 + CSS3 (Grid/Flexbox) + inline SVG — zero runtime dependencies

VERY IMPORTANT: To avoid what is often referred to as "AI slop", avoid excessive centered layouts, purple gradients, uniform rounded corners, and Inter font.

インフォグラフィックス、インタラクティブなダイアグラム、アーキテクチャビジュアル、データダッシュボード、豊富なビジュアル成果物など、精巧で自己完結型の静的 HTML 成果物を作成するためのツールスイート。このスキルは、インタラクティブな HTML アーティファクトの作成、自己完結型の Web コンポーネントの構築、静的な HTML ビジュアライゼーションの生成、インタラクティブな図の作成、ビジュアル インフォグラフィックの作成、または単一の HTML ファイルとしての高密度ビジュアルのレンダリングを求められた場合に使用します。ゼロ ビルド ツールチェーン — React、Vite、Parcel はありません。純粋な HTML5 + CSS3 (グリッド/フレックスボックス) + インライン SVG。トリガー: 「インタラクティブな HTML の作成」、「自己完結型の Web コンポーネントの構築」、「静的な HTML 視覚化の生成」、「インタラクティブなダイアグラムの作成」、「インフォグラフィックの作成」、「HTML アーティファクトとしてレンダリング」、「ビジュアル ダッシュボードの構築」、「ブラウザーで開くことができるダイアグラムの作成」。 ソース: mathews-tom/praxis-skills。