skills.rest
BoardAI
BoardAIOFFICIAL
Explore all skills by this author →
WebsiteGitHub

design

Applies a monotone design system to HTML, PPTX, and DOCX deliverables.

4|2|Updated May 13, 2026
Search Tags:#typography#design system#color palette#dashboard#pptx#legal documents#html reports
One-click install
npx skills add https://github.com/BoardAI/vallor-plugins --skill design-boardai
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/BoardAI/vallor-plugins/tree/main/vallor/skills/design
Command: npx skills add https://github.com/BoardAI/vallor-plugins --skill design-boardai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Legal and procurement deliverables lose credibility when they look like marketing material. This Skill enforces a single trusted, monochrome design system across every HTML report, dashboard, PPTX approval deck, and DOCX redline the plugin produces, so output looks like it came from inside a law firm. ## Core Features & Use Cases - Locked color palette and typography: A fixed set of near-black, navy, and maroon hex values with defined font stacks for HTML, PPTX, and DOCX, plus an explicit banned list (gradients, drop shadows, emoji, pie charts). - Standardized patterns: Cover mastheads, severity markers (BLOCKING/HIGH/MEDIUM/LOW), pull quotes, table rules, and mandatory confidentiality footers for every page. - Dashboard and procurement overlays: Reference files define a reusable dashboard skeleton with big-number stat cards, tab rules, XSS-safe rendering via textContent, and an extended procurement chart palette. - Use Case: Before generating a contract review memo or RFQ analysis dashboard, load this Skill so the HTML output uses the shared CSS variables, severity dots, and privileged-and-confidential footer automatically. ## Quick Start Load the design skill and format this contract review report as an HTML document following the design system.

Frequently Asked Questions about design

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

FAQPage Schema
How do I format an HTML report to look like a legal document?▼

Apply the design system's fixed palette (near-black text, navy accent, maroon for blocking issues), Source Serif Pro body font, single-column 720px layout, and the provided CSS variable block. Add the masthead rule and privileged-and-confidential footer to every page.

What colors are allowed in the design system for legal deliverables?▼

Only a fixed grayscale set plus three semantic accents: navy #1F3A5F for rules and titles, maroon #7B1F1F for blocking findings, and olive #5A5A2A for medium severity. Gradients, drop shadows, and any other colors are banned.

Can I use pie charts in procurement dashboards?▼

Pie and donut charts are banned in legal work product. Procurement outputs allow them only inside the negotiation-report cost-reduction-sources tab; the default is a horizontal bar chart using the extended procurement palette.

How do dashboards prevent XSS from vendor-supplied data?▼

All untrusted cell values, labels, and tooltips must be set via textContent, never innerHTML or template-string interpolation. URLs in href or src attributes are scheme-checked, allowing only http, https, and mailto.

When should this design skill be loaded?▼

Load it before generating any visual deliverable: HTML reports, dashboards, PPTX approval decks, or DOCX redlines. Other skills in the plugin are instructed to read it first and never override the banned list on their own.

Related Skills

Explore More Design & Creative Skills→
GetStimulusGetStimulus

contract-renewal

Assess expiring supplier contracts and recommend renewal, renegotiation, or re-bid decisions.

Official
Intermediate
nyldnnyldn
4.0k

skill-doc-delivery

Convert Markdown outputs into DOCX, PPTX, and XLSX office documents.

Community
Advanced
aiunlocked1412aiunlocked1412
14

procurement-pro

Standardize RFP/RFQ workflows and templates for enterprise procurement.

Community
Advanced
inbharataiinbharatai
22

logo-designer

Generate primary, monochrome, favicon, and animated SVG logo variants.

Community
Intermediate