Silverpoint にはスターター テンプレート(起動ウインドウの「開始方法」のカード、ファイル ▸ テンプレートから新規作成)と スタイルプリセット(エージェントの get_style が提供するもの)が付属しています。どちらも、自分で管理するフォルダに独自のものを追加して拡張できます。スキルも同じ仕組みです(skills.md を参照)。
テンプレートは、新しいドキュメントを始めるもとになるデザインです。
| 対象 | 場所 | 変更方法 |
|---|---|---|
| テンプレート | ~/Library/Application Support/Silverpoint/Templates | SILVERPOINT_TEMPLATES_DIR |
このフォルダには *.silverpoint パッケージと *.json ドキュメント(document.json 単体で、画像は含みません)を置きます。アプリと silverpoint templates は同じフォルダを読みます。隠しファイル、サブフォルダ、ほかの拡張子のファイルは無視されます。Silverpoint のドキュメントとして読めないファイルはスキップされ、警告として報告されます(silverpoint templates では stderr に出力)。クラッシュすることはありません。
名前 は拡張子を除いたファイル名です(Phone App.json は「Phone App」)。ドキュメント自体にはタイトルのフィールドがないため、ファイル名がそのまま名前になります。テンプレートは大文字と小文字を区別せず、名前順に並びます。Hero.silverpoint と Hero.json が両方ある場合は 1 つのテンプレートとして扱われ、パッケージが優先されて .json は警告になります。
カードをクリックするか、メニュー項目を選ぶと、テンプレートの内容で 名称未設定の新しいドキュメント が開きます。このドキュメントはコピーです。ファイルを持たないので保存時に保存先を尋ねられ、何をしてもテンプレートは変わりません。.silverpoint テンプレートは画像も一緒に持ってきます。
ファイル ▸ テンプレートとして保存… は名前を尋ね、現在のドキュメントを <name>.silverpoint としてテンプレートフォルダに保存します。選択範囲にトップレベルのフレームが含まれるときは 選択したフレームのみ チェックボックスが表示されます。オンにすると、テンプレートにはそのフレームだけが入り、それらが依存するもの(ドキュメントのテーマ、変数、テキストスタイルとレイヤースタイル、トップレベルのコンポーネント、残したレイヤーが使う画像)も残ります。キャンバス全体に属するコメントとインポート元は含まれません。
同じ名前のテンプレートがすでにある場合(拡張子はどちらでも、大文字と小文字は区別しません)、Silverpoint は 置き換える前に確認します。名前はファイル名として安全な形に変換されます。スラッシュ、バックスラッシュ、コロンはダッシュになり、先頭と末尾のドット、ダッシュ、スペースは取り除かれるので、テンプレートは常にテンプレートフォルダの直下に保存されます(../Evil は Evil として保存されます)。文字や数字をひとつも含まない名前は受け付けません。
ファイル ▸ テンプレートをFinderに表示 でフォルダを開きます(フォルダがなければ先に作成します)。カードのコンテキストメニューの 削除… は確認したうえで、ファイルを ゴミ箱 に移動します(完全には削除しません)。カードのメニューには「開く」と「Finderに表示」もあります。
設定 ▸ 一般 ▸ テンプレートとスタイル(デザインシステムのグループ内)には両方のフォルダが表示されます。それぞれのパスと「Finderに表示」(フォルダがなければ作成します)、あなたの項目、読み込めないファイルごとにその理由を示す行(silverpoint templates と silverpoint styles が出力するのと同じ警告)、そして組み込みの項目である「開始方法」のテンプレートと付属のすべてのスタイルプリセットが並びます。付属のプリセットと同じ名前のあなたのスタイルには、それを置き換えることが表示されます。このセクションは読み取り専用です(フォルダは Finder で編集してください)。設定ウインドウが表示されたときやキーウインドウになったとき、そして「再読み込み」で、フォルダを読み込み直します。
スタイルプリセットは、スキルと同じ形式の Markdown ファイルです(title: と summary: のフロントマターのあとにガイドが続きます)。フォント、色、タイプスケール、形状を定めます。get_style で読み込みます。
付属のプリセットは 11 個です。8 個はページと画面用(bold-brutalist、corporate-clean、dark-tech-glow、editorial-serif、luxury-noir、soft-pastel、swiss-minimal、warm-organic)、3 個は図解用で、diagrams スキルが指定するものです。
| プリセット | 見た目 | フォント |
|---|---|---|
diagram-minimal-light | 温かみのある紙の上に白いノード、錆色のアクセント 1 色 | 見出しと本文に SF Pro、技術的なテキストに SF Mono |
diagram-minimal-dark | ほぼ黒の上に明るめの面、琥珀色のアクセント 1 色 | 見出しと本文に SF Pro、技術的なテキストに SF Mono |
diagram-editorial | クリーム色の上で図の上にセリフ体のタイトル、インクブルーのアクセント 1 色 | 見出しに Charter、本文に SF Pro、SF Mono |
ページ用プリセットの色: すべてのロールをライトとダークで。 8 個のページ用プリセットはどれも同じカラーロールを定義し、それぞれにそのプリセットのためにデザインしたライトとダークの値があります(反転ではありません)。
| ロール | 用途 |
|---|---|
background | ページ |
surface | カード、パネル、フィールド |
ink | 面の前景色: background と surface の上の見出しと本文 |
muted | 控えめな前景色: キャプション、ラベル、プレースホルダー、コントロールと入力欄の枠線 |
border | ヘアラインと区切り線 |
accent | プライマリボタン、リンク、ハイライト |
onAccent | accent の上のテキストとアイコン |
destructive | 削除ボタンとエラーテキスト |
onDestructive | destructive の上のテキストとアイコン |
focus | フォーカスリング |
プリセットがもともと持っていた追加のロール(accent2、accent3、success、soft-pastel の 4 つの pastels)も残り、ダークの値も付いています。色の行は - accent: #RRGGBB / #RRGGBB の形で、2 つの値は見出しが示す順に並びます。見出しは ## Colors (mode: light / dark; define these with set_variables) で、もともとダークな 2 つのプリセット(dark-tech-glow、luxury-noir)では mode: dark / light となり、最初の値がそのプリセット本来の見た目のままです。これらは mode テーマ軸を持つ変数として適用します。最初の値はそのまま(デフォルトのモード)、2 つ目の値にはもう一方のモードのタグを付けます。各プリセットの Colors セクションには例が 1 行あり、get_style はプリセットのほかの部分と一緒にそれを返します。
{"op":"set_variables","variables":{"accent":{"type":"color","value":[{"value":"#7A1E2C"},{"value":"#E07A8A","theme":{"mode":"dark"}}]}},"themes":{"mode":["light","dark"]}}
どの組み合わせも両方のモードでコントラストの基準を満たします(BundledStyleDataTests と、テーマのモードごとに確認する contrast リント)。background と surface の上の ink、background の上の muted と destructive(エラーテキストなので)、accent の上の onAccent、destructive の上の onDestructive は 4.5:1、background の上の accent と focus、そして surface の上の focus は 3:1 です。border は装飾なので確認しません。すでに違いのある領域の間のヘアラインには意味がないためで、コントロールの枠線には 3:1 以上を満たす muted を使います。save_style も同じライト / ダークの形式を受け付け、本文を渡されたとおりに書き込みます。
図解用プリセットはそれぞれ、6 つのパレット変数(background、surface、ink、muted、border、accent)を 1 つのモードで定義します(ライトとダークの見た目は別のプリセットです)。小さなタイプスケール、10 以下の角丸、4 pt の間隔単位を持ち、注記では 1 pt のヘアライン、影なし、アクセント 1 色、横並びの凡例を求めています。フォントは macOS にインストールされていて list_fonts が提供するものです。diagram-design が使う書体(どちらも macOS には付属しません)の代わりに、Geist と Geist Mono には SF Pro と SF Mono、Instrument Serif には Charter を使います。
| レイヤー | 場所 | 編集する人 |
|---|---|---|
| 付属 | アプリ内(Resources/Styles) | 編集不可。同じ名前のスタイルを保存して上書きします |
| パッケージ | ドキュメントがリンクする各デザインシステムパッケージの styles/*.md(docs/design-system-packages.md) | パッケージの作者 |
| ユーザー | ~/Library/Application Support/Silverpoint/Styles/*.md(SILVERPOINT_STYLES_DIR) | あなた。エージェントの save_style |
優先順位: 同じ名前なら、ユーザーのスタイルがパッケージのスタイルより、パッケージのスタイルが付属のものより優先されます(名前は .md を除いたファイル名を小文字にし、文字と数字以外の連続を 1 つのダッシュにしたもので、スキルと同じです)。解決されたスタイルは出どころを記録し、下のレイヤーのものを置き換えたときはそう示します。silverpoint styles は user (overrides bundled) や package (overrides bundled) と出力します。パッケージのスタイルがリストに入るのは、ドキュメントがそのパッケージをリンクしている間だけです(silverpoint styles <doc>、get_style、そのドキュメントに対するエージェントのプロンプト)。フォルダに同じ名前のファイルが 2 つあるときは、ファイル名のバイト順で先のものが優先され、もう一方は警告になります。
スタイルにはドキュメントのレイヤーがなく、無効化リストもありません。ドキュメントは見た目を変数、テーマ、テキストスタイルに持っていて、エージェントはそれをすでに読んでいます。スタイルは、まだ見た目のないデザインの出発点です。(どちらも今後の検討事項です。バックログを参照してください。)
get_style、その説明(解決されたすべてのスタイルの索引で、name の選択肢でもあります)、エージェントのシステムプロンプト(「Styles available through get_style」)、MCP クライアント、CLI はすべて、解決済みの同じリストを見ます。リストはツールの実行時に読まれるので、ターンの合間に保存したスタイルもすぐに見つかります。
save_style「この見た目を Editorial という名前のスタイルとして保存して」と頼むと、エージェントは name、title、summary、body、confirm を付けて save_style を呼びます。共有カタログのツールの 1 つで、save_skill と同じ確認の流れです。
<name>.md をあなたのスタイルフォルダに書き込みます。silverpoint call では、confirm: true がなければプレビュー({written: false, slug, title, replaces, text, diff})を返し、何も書き込みません。付けると書き込み、written: true を返します。既存のスタイルを置き換えるとき、replaces は user か bundled です。別の名前のファイル(Neon Look.md)から来たスタイルの上に保存すると、そのファイルを書き換えるので、読まれるのは保存したほうです。
フォントの組み合わせは、見出しの書体と本文の書体(ときには等幅の書体も)の組です。スタイルのパレットに別の文字の声を合わせられるよう、スタイルプリセットとは分けてあります。get_font_pairing が提供します。name を付けるとその組み合わせの書体、タグ、テキストを返し、付けないと組み合わせごとに 1 行、slug — summary [moods; uses] を返します。これは mood と use で絞り込めます(それぞれ大文字と小文字を区別せず完全一致で、両方指定すると両方で絞り込みます)。一致がないときは No font pairing matches で始まる行と両方の語彙を返し、不明な名前は組み合わせの一覧を示すツールエラーになります。共有カタログにあるので、エージェント、MCP クライアント、silverpoint call <doc> get_font_pairing '{"mood":"calm"}' のどれでも使えます。
それぞれ Resources/Pairings にある Markdown ファイルで、フロントマターは次のとおりです。
title: と summary:。スタイルと同じです。heading: と body:。2 つのファミリーで、mono: は任意です。moods:。editorial、calm、technical、playful、luxurious、friendly、formal、bold からのカンマ区切りのリスト。uses:。app UI、marketing、long reading、data、slides からのカンマ区切りのリスト。そのあとのテキストは # <title> と書体を示す 1 行で始まり、## Sizes and weights(合うポイントサイズとウェイト)と ## Avoid が続きます。付属の組み合わせは 14 個で、new-york-sf-pro(editorial)、sf-pro-sf-mono(technical)、sf-pro-rounded(friendly)などがあります。どの書体も macOS に付属するフォントです。SF Pro、SF Pro Rounded、SF Mono、New York はシステムのデザインで(SF Pro Rounded と New York は、その名前でインストールされていないときはシステムフォントの丸ゴシックとセリフのデザインで描かれます)、ほかは Didot、Avenir Next、Charter、Helvetica Neue のようなインストール済みのファミリーです。付属データに対するテストが、実行している Mac でそれぞれが解決できることを確認します。
フォントの組み合わせはスタイルと同じ仕組みで、同じリゾルバによってレイヤー化され、スラッグ(スタイルと同じくファイル名)で照合されます。
| レイヤー | 場所 | 優先する相手 |
|---|---|---|
| ユーザー | ~/Library/Application Support/Silverpoint/Pairings/*.md(SILVERPOINT_PAIRINGS_DIR) | パッケージ、付属 |
| パッケージ | リンクしたデザインシステムパッケージの pairings/*.md(design-system-packages.md を参照) | 付属 |
| 付属 | Resources/Pairings/*.md |
パッケージの組み合わせは、ドキュメントがそのパッケージをリンクしている間だけ使えます。リンクした 2 つのパッケージが同じスラッグを定義しているときは、先のものが優先されます。ユーザーフォルダやパッケージの pairings/ にあるファイルは付属のものと同じフロントマターを持ち、title、summary、heading、body を指定する必要があります。そのどれかがない、フロントマターがない、または UTF-8 テキストでないファイルは、そのファイル名を示す警告とともにスキップされ(同じスラッグのファイルが 2 つあるときは、ファイル名のバイト順で先のものが優先され、もう一方は警告になります)、残りは読み込まれます。moods と uses は自由な語です。上の付属の語彙が縛るのは付属の組み合わせだけで、絞り込みは組み合わせに書かれている語とそのまま照合します。書体は確認されません。インストール済みのファミリーを指定してください。そうでないとデザインはシステムフォントで表示されます。get_font_pairing は実行時にレイヤーを解決するので、ターンの合間にフォルダへ追加したファイルも次の呼び出しで使えます。ただし説明と name の選択肢は、ツール一覧を作った時点の組み合わせを示します。エージェント、MCP(silverpoint mcp)、silverpoint call はすべて同じフォルダを読みます。
プロダクトの種類は、スタイルを選ぶ前に、ある種類のプロダクトに何が合うかを示します。どのページ用プリセットとフォントの組み合わせが合うか、色のムードと文字のムード、避けるべきこと(「banking: 遊び心のある丸い見出し書体は使わない、ネオンやグローのアクセントは使わない」)です。方向性は、それぞれのプロダクトの目的をもとに私たちが独自に書いたものです。たとえば習慣トラッカーは毎日使う落ち着いた道具なので、soft-pastel か warm-organic と親しみやすい文字が割り当てられ、「ランディングページのレイアウトにしない」がアンチパターンの 1 つです。
これらは Resources/Products/products.md にある 1 つの表で、プロダクトごとに 1 行(全 38 行)あり、列は次のとおりです。
| 列 | 内容 |
|---|---|
slug | get_style と CLI で使うプロダクトの名前(banking、habit-tracker、developer-tool) |
title | タイトル |
family | プロダクトファミリー。パレットの名前になります |
presets | 合う付属のページ用プリセットを 1〜3 個、カンマ区切りで |
pairings | 合うフォントの組み合わせを 1〜3 個、カンマ区切りで |
color mood | 色を表す 1 つのフレーズ |
type mood | 組み合わせのムードの 1 つ(editorial、calm、technical、playful、luxurious、friendly、formal、bold) |
avoid | ; で区切ったアンチパターン 1〜3 個。理由が自明でないときはその理由も |
ファミリーは commerce、developer-tools、editorial-media、enterprise、finance、health-wellness、kids-education、productivity、social-community、travel-hospitality です。それぞれに独自のパレットが Resources/Palettes/<family>.md にあり、ページ用プリセットと同じ形式です。## Colors (mode: light / dark; define these with set_variables) の下に同じ 10 個のロールが #LIGHT / #DARK の行で並び、Apply as one batch_design operation: の例が付きます。パレットはファミリーのためにデザインされていて(どの色も Tailwind の既定の色ではなく、アクセントが重なるものはありません)、両方のモードでプリセットと同じ確認を通ります。上のコントラストの組み合わせ、反転ではなくより暗いダークモード、操作ランナーを通して適用できる例、そしてライトとダークで問題のない contrast リントです。
get_style に product を付けて name を付けないと、そのプロダクトの方向性を返します。ファミリーを含む Product: の行、色と文字のムード、合うプリセットと組み合わせの索引行(解決済みのスタイルと組み合わせのとおりなので、ユーザーによる上書きの概要が表示されます)、アンチパターン、そしてファミリーのパレットの Colors セクションをそのまま返します。プロダクトはゆるく照合されます(Habit Tracker も HABIT_TRACKER も habit-tracker です)。不明なプロダクトは、すべてのファミリーとそのプロダクトを示すツールエラーになります。name を付けると、get_style はこれまでどおりそのスタイルを返して product を無視し、どちらもないと両方を挙げるエラーになります。silverpoint styles --product <slug> は同じテキストを出力し、silverpoint styles --products はプロダクトの種類をファミリー別に一覧にします(下のコマンドラインを参照)。design-principles は、スタイルを選ぶ前に get_style {product} を読むようエージェントに求めます。
プロダクトの種類とファミリーのパレットは、フォントの組み合わせと同じリゾルバでレイヤー化されます。プロダクトはスラッグで、パレットはファミリーで照合されます。
| レイヤー | 場所 | 優先する相手 |
|---|---|---|
| ユーザー | ~/Library/Application Support/Silverpoint/Products/*.md とその palettes/<family>.md(SILVERPOINT_PRODUCTS_DIR) | パッケージ、付属 |
| パッケージ | リンクしたデザインシステムパッケージの products/*.md と palettes/*.md(design-system-packages.md を参照) | 付属 |
| 付属 | Resources/Products/products.md と Resources/Palettes/<family>.md |
ユーザーフォルダ(またはパッケージの products/)のファイルには、付属のものと同じ形式のプロダクトの表を 1 つ以上置きます。同じヘッダー行 | slug | title | family | presets | pairings | color mood | type mood | avoid | とその --- の行が必要です。ファイルの数に制限はなく、ファイル名のバイト順に読まれ、行は順番どおりに読まれます。スラッグとファミリーはスラッグ化され(Pet Care は pet-care)、ファミリーのパレットは表の隣にある palettes/<family>.md ファイルで、付属のものと同じ形式です。title と summary のフロントマターと、10 個すべてのロールを - role: #RRGGBB / #RRGGBB(ライト / ダーク)で書いた ## Colors セクションを持ちます。パッケージとユーザーフォルダのパレットは、下のレイヤーにある同じファミリーのパレットを置き換えます。パッケージのものはドキュメントがそれをリンクしている間だけ使え、リンクした 2 つのパッケージが同じスラッグやファミリーを定義しているときは先のものが優先されます。
これらのフォルダにあるものがエラーになることはありません。セルの数が違う行、slug、family、presets、pairings、avoid のどれかが空の行(title とムードは空でもかまいません)、そのレイヤーにすでにあるスラッグを持つ 2 つ目の行、空行(表の終わりになります)のあとの行、プロダクトの表がないファイルは、ファイル名と行番号を示す警告とともにスキップされます(skipped mine.md line 5: has 4 cells, not 8)。## Colors セクションがない、ロールが欠けている、またはロールが #RRGGBB / #RRGGBB の形で書かれていないパレットは、ファイル名とロールを示す警告とともにスキップされ、そのファミリーを引き受けないので、付属またはパッケージのパレットがそのまま使われます。確認されるのは構造だけで、付属のパレットが通るコントラストの確認はあなたのものには行われません。警告は silverpoint styles --product と --products で表示され(stderr)、エージェントと MCP は読み込めないものをスキップします。
プロダクトは、どのレイヤーにもパレットがないファミリーを指定してもかまいません。その場合、方向性の最後は Palette (<family>): no palette for this family. になります。指定したプリセットや組み合わせが解決済みのスタイルや組み合わせにないときは一覧から外され、一覧の最後に (not found, left out: <slug>, <slug>) の行が 1 つ付きます。get_style は実行時にレイヤーを解決するので、ターンの合間に追加した行も次の呼び出しで使えます。ただし product の選択肢はツール一覧を作った時点のプロダクトの種類を示し、不明なプロダクトのエラーは解決済みのファミリーとそのプロダクトを示します。エージェント、MCP(silverpoint mcp)、silverpoint call、silverpoint styles はすべて同じフォルダを読みます。
ベータにはまだ含まれていません。silverpoint コマンドラインツールはダウンロード版に入っていないため、この節はソースからビルドした場合の説明です。
silverpoint styles [<file.silverpoint>] [--json] [--show <name>]
silverpoint styles --product <slug> [--json]
silverpoint styles --products [--json]
silverpoint templates [--json]
styles は解決済みのスタイルを 1 行ずつ(ドキュメントを指定すると、それがリンクするパッケージのものも)slug<TAB>source[ (overrides bundled)]<TAB>title の形で、--json を付けると {slug, title, summary, source, overrides} の配列で一覧にします。--show <name> は get_style が返すテキストを出力します(不明な名前では終了コード 1)。--product <slug> は get_style に product を付けたときの結果を出力し(--json を付けると {slug, title, family, body}。不明なプロダクトではツールのエラーとともに終了コード 1)、--products はプロダクトの種類を slug<TAB>family<TAB>title の形でファミリー順、次にスラッグ順で一覧にします(--json を付けると {slug, title, family} の配列)。どちらも、一緒に使えるフラグは --json だけです。templates はユーザーテンプレートを 1 行に name<TAB>absolute path の形で、--json を付けると {name, file} の配列で一覧にします。フォルダがなければ何も表示せず終了コード 0 で終わります。警告は stderr に出力されます。どちらも読み取り専用で、SILVERPOINT_STYLES_DIR と SILVERPOINT_TEMPLATES_DIR(--product と --products はプロダクトフォルダの SILVERPOINT_PRODUCTS_DIR)に従い、対応していないフラグでは終了コード 2 で終わります。
これらの変数の古い VELLUM_ の綴りも、ほかのすべての SILVERPOINT_* 変数と同じく引き続き使えます。