open-design/skills/invoice/SKILL.md
Tom Huang 6f6bf31dd2
Refactor project name from "Open Claude Design" to "Open Design" (#1)
* Refactor project name from "Open Claude Design" to "Open Design"

- Updated project name in package.json, package-lock.json, and README files.
- Changed CLI commands and references from "ocd" to "od".
- Adjusted file structure references in documentation and code to reflect new naming conventions.
- Enhanced .gitignore to include new runtime data files.
- Updated metadata in LICENSE file to match new project name.

* Add contributing guidelines in English and Chinese

- Introduced CONTRIBUTING.md and CONTRIBUTING.zh-CN.md to provide clear instructions for contributors.
- Outlined contribution types, local setup instructions, and merging criteria for skills and design systems.
- Enhanced README files to reference the new contributing guidelines.
2026-04-28 16:03:35 +08:00

1.4 KiB

name description triggers od
invoice A printable invoice page — sender + recipient block, line items table, tax breakdown, totals, and payment instructions. Use when the brief mentions "invoice", "bill", "billing statement", or "发票".
invoice
bill
billing statement
发票
账单
mode platform scenario preview design_system example_prompt
prototype desktop finance
type entry
html index.html
requires sections
true
color
typography
layout
components
Create an invoice from a freelance design studio billing a client for a brand identity project — three line items, 10% retainer, 9% sales tax.

Invoice Skill

Produce a single-page printable invoice.

Workflow

  1. Read DESIGN.md.
  2. Layout:
    • Top band: studio brand on the left, "INVOICE" + number + date + due date on the right.
    • Two columns: From (sender) / Bill to (recipient) with addresses.
    • Project ref + payment-terms strip.
    • Line items table: description / qty / unit / amount.
    • Right-aligned totals block: subtotal, retainer, tax, total due.
    • Payment instructions (bank, wire, ACH).
    • Thank-you note + signature line.
  3. Print stylesheet @media print to remove backgrounds.

Output contract

<artifact identifier="invoice-name" type="text/html" title="Invoice">
<!doctype html>...</artifact>