About this skill

Problem

Teams often paste analytics into ad hoc HTML pages, but typography, colors, table scrolling, icon style, and brand placement drift. This skill fixes the YonSuite white-background style for analyst-facing reports and slide-style HTML decks.

How It Works

The skill targets data reports, dashboards, and fullscreen page decks. For scrolling reports, it structures pages as KPI cards → charts → detail tables; for PPT mode, it uses a fixed 1920×1080 canvas with keyboard or touch paging. Red is reserved for emphasis and should stay under 20%, while body copy, charts, and cards use white and gray. Fixed UI assets include the top-left logo and bottom-right brand footer. Charts are laid out two per row, tables use sticky headers and independent scrolling, and icons use Lucide inline SVG. A checklist validates font size, color consistency, chart rendering, table scrolling, layout spacing, and icon rendering.

Boundaries

It fits white-background brand reports, monitoring dashboards, and short product or skill decks. It is not intended for long plain-text documents, dark dashboards, or one-off pages with no brand constraints. Data should be generated from structured JSON, and PPT mode must keep the five fixed UI elements and paging rules.

Screenshots

Use Cases

Consolidate sales KPIs, trend charts, and order details into a single white-background report
Generate a keyboard-paginated YonSuite-style HTML deck for a skill introduction
Highlight abnormal KPIs and overdue rows in a red-and-gray monitoring dashboard
Produce a client-facing report page with Lucide icons, fixed logo, and brand footer

Best For

Frontend engineers who need metrics, charts, and tables in one branded report style
Developers who must build horizontal slide-style HTML decks for product introductions
BI analysts who need consistent KPI, table, and icon styling
Solutions consultants who need client-facing YonSuite white-background reports

Related Skills

Customer Insight Analyzer

@user_fc05d2ec/customer-insight-analyzer

Analyzes smart customer-service chat logs with semantic clustering to generate word clouds, Top K frequent questions, and personalized guess-you-ask recommendations.

Data Analysis 2026.08.29 ↓ 363

KeyAPI Reddit Content Analytics

@user_2e47cd26/keyapi-reddit-content-analytics

Maps natural-language Reddit requests to KeyAPI REST workflows, validates endpoint contracts against official docs, and executes search, detail, comment, ranking, and report tasks.

Data Analysis 2026.08.29 ↓ 366

NEP Paper Intelligence Officer

@user_116023ea/nep-watcher

Schedules fetching from NEP and custom academic sites, filters and ranks papers by keywords, generates Chinese summaries, and pushes Feishu cards with local download archiving.

Data Analysis 2026.08.29 ↓ 371

Curve Lab

@user_6bbd6f5f/curve-lab

Browser-based CSV/TXT visualizer with multi-Y-axis curves, smoothing, and PNG/JSON/CSV export.