diff --git a/site/assets/style.css b/site/assets/style.css new file mode 100644 index 0000000..87d5c0d --- /dev/null +++ b/site/assets/style.css @@ -0,0 +1,457 @@ +/* CL4R1T4S // ANALYSIS — shared stylesheet + leak-document aesthetic: dark bg, mono headings, amber accent */ + +:root { + --bg: #0b0b0d; + --bg-alt: #131317; + --bg-hover: #1a1a1f; + --fg: #e6e6e6; + --fg-dim: #9a9aa3; + --accent: #c8ff00; + --accent-dim: #a6d200; + --warn: #ff5555; + --info: #66d9ef; + --border: #25252c; + --border-soft: #1d1d23; + + --mono: "JetBrains Mono", "Fira Code", "SF Mono", Menlo, Consolas, monospace; + --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", + "Noto Sans JP", Helvetica, Arial, sans-serif; +} + +* { box-sizing: border-box; } + +html, body { + margin: 0; + padding: 0; + background: var(--bg); + color: var(--fg); + font-family: var(--sans); + font-size: 16px; + line-height: 1.75; + -webkit-font-smoothing: antialiased; +} + +body { + background-image: + linear-gradient(to bottom, rgba(200, 255, 0, 0.025), transparent 500px), + repeating-linear-gradient( + 0deg, + transparent, + transparent 2px, + rgba(255, 255, 255, 0.008) 2px, + rgba(255, 255, 255, 0.008) 3px + ); + min-height: 100vh; +} + +a { + color: var(--accent); + text-decoration: none; + transition: color 0.12s ease; +} +a:hover { text-decoration: underline; } + +/* ── Header / Nav ─────────────────────────────── */ +.site-header { + border-bottom: 1px solid var(--border); + padding: 16px 32px; + display: flex; + justify-content: space-between; + align-items: center; + position: sticky; + top: 0; + background: rgba(11, 11, 13, 0.92); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + z-index: 10; +} + +.site-title { + font-family: var(--mono); + font-size: 17px; + font-weight: 700; + letter-spacing: 0.06em; + color: var(--accent); +} +.site-title span { + color: var(--fg-dim); + margin: 0 4px; +} + +.site-nav { + display: flex; + gap: 6px; + font-family: var(--mono); + font-size: 12px; + flex-wrap: wrap; +} + +.site-nav a { + color: var(--fg-dim); + padding: 6px 10px; + border: 1px solid transparent; + letter-spacing: 0.04em; +} + +.site-nav a:hover { + color: var(--accent); + border-color: var(--border); + text-decoration: none; +} + +.site-nav a.active { + color: var(--accent); + border-color: var(--accent); + background: rgba(200, 255, 0, 0.05); +} + +/* ── Main ─────────────────────────────────────── */ +main { + max-width: 980px; + margin: 0 auto; + padding: 56px 32px; +} + +h1, h2, h3, h4 { + font-family: var(--mono); + color: var(--fg); + letter-spacing: 0.02em; + line-height: 1.35; +} + +h1 { + font-size: 34px; + margin: 0 0 20px; + padding-bottom: 14px; + border-bottom: 2px solid var(--accent); + display: inline-block; +} + +h2 { + font-size: 22px; + margin-top: 56px; + margin-bottom: 16px; + padding-left: 14px; + border-left: 4px solid var(--accent); +} + +h3 { + font-size: 17px; + color: var(--accent-dim); + margin-top: 32px; + margin-bottom: 10px; +} + +h4 { + font-size: 14px; + color: var(--fg-dim); + margin-top: 20px; + margin-bottom: 6px; + text-transform: uppercase; + letter-spacing: 0.08em; +} + +p { margin: 12px 0; } + +/* ── Hero block ────────────────────────────────── */ +.hero { + border: 1px solid var(--border); + background: var(--bg-alt); + padding: 32px; + margin-bottom: 48px; + position: relative; +} + +.hero::before { + content: ""; + position: absolute; + top: 0; left: 0; right: 0; + height: 2px; + background: linear-gradient(to right, var(--accent), transparent); +} + +.hero .meta { + font-family: var(--mono); + font-size: 11px; + color: var(--fg-dim); + margin-bottom: 20px; + letter-spacing: 0.1em; + text-transform: uppercase; +} + +.hero p { font-size: 16px; } + +.hero-lead { + color: var(--accent); + font-family: var(--mono); + font-size: 14px; + line-height: 1.7; +} + +/* ── Card grid ─────────────────────────────────── */ +.grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 14px; + margin: 24px 0 48px; +} + +.card { + display: block; + border: 1px solid var(--border); + background: var(--bg-alt); + padding: 22px; + transition: border-color 0.15s ease, transform 0.15s ease; + color: var(--fg); +} + +.card:hover { + border-color: var(--accent); + text-decoration: none; + transform: translateY(-2px); +} + +.card h3 { + margin-top: 6px; + margin-bottom: 8px; + font-size: 16px; + color: var(--fg); +} + +.card .card-num { + font-family: var(--mono); + color: var(--accent); + font-size: 11px; + letter-spacing: 0.1em; +} + +.card p { + color: var(--fg-dim); + font-size: 13.5px; + margin: 8px 0 0; + line-height: 1.6; +} + +/* ── Tables ────────────────────────────────────── */ +table { + width: 100%; + border-collapse: collapse; + margin: 20px 0; + font-size: 14px; +} + +th, td { + border: 1px solid var(--border); + padding: 10px 14px; + text-align: left; + vertical-align: top; +} + +th { + background: var(--bg-alt); + font-family: var(--mono); + color: var(--accent-dim); + font-weight: 600; + letter-spacing: 0.03em; +} + +tbody tr:hover td { + background: rgba(200, 255, 0, 0.03); +} + +/* ── Blockquote / pull quote ───────────────────── */ +blockquote { + border-left: 3px solid var(--accent); + margin: 20px 0; + padding: 10px 20px; + background: var(--bg-alt); + font-family: var(--mono); + font-size: 13.5px; + line-height: 1.65; + color: var(--fg); +} + +blockquote cite { + display: block; + margin-top: 10px; + color: var(--fg-dim); + font-size: 11.5px; + font-style: normal; + letter-spacing: 0.05em; +} + +/* ── Code ──────────────────────────────────────── */ +code { + font-family: var(--mono); + background: var(--bg-alt); + color: var(--accent); + padding: 2px 6px; + border-radius: 2px; + font-size: 0.9em; + border: 1px solid var(--border-soft); +} + +pre { + background: var(--bg-alt); + border: 1px solid var(--border); + padding: 16px; + overflow-x: auto; + font-family: var(--mono); + font-size: 13px; + line-height: 1.6; + border-radius: 2px; +} + +pre code { + background: none; + border: none; + color: var(--fg); + padding: 0; + font-size: inherit; +} + +/* ── Callout boxes ─────────────────────────────── */ +.warning, .note, .info { + padding: 16px 20px; + margin: 24px 0; + font-size: 14px; + border-left-width: 3px; + border-left-style: solid; +} + +.warning { + border: 1px solid var(--warn); + border-left-width: 3px; + background: rgba(255, 85, 85, 0.05); +} +.warning strong { color: var(--warn); font-family: var(--mono); } + +.note { + border: 1px solid var(--border); + border-left-color: var(--accent); + background: var(--bg-alt); +} +.note strong { color: var(--accent); font-family: var(--mono); } + +.info { + border: 1px solid var(--border); + border-left-color: var(--info); + background: var(--bg-alt); +} +.info strong { color: var(--info); font-family: var(--mono); } + +/* ── Footer ────────────────────────────────────── */ +.site-footer { + border-top: 1px solid var(--border); + margin-top: 72px; + padding: 28px 32px; + text-align: center; + font-family: var(--mono); + font-size: 11.5px; + color: var(--fg-dim); + letter-spacing: 0.05em; +} + +.site-footer a { color: var(--fg-dim); } +.site-footer a:hover { color: var(--accent); } + +/* ── Prev / Next nav ───────────────────────────── */ +.page-nav { + display: flex; + justify-content: space-between; + gap: 14px; + margin-top: 56px; + padding-top: 24px; + border-top: 1px solid var(--border); + font-family: var(--mono); + font-size: 13px; +} + +.page-nav a { + padding: 12px 18px; + border: 1px solid var(--border); + color: var(--fg); + flex: 1; + max-width: 48%; +} + +.page-nav a:hover { + border-color: var(--accent); + text-decoration: none; +} + +.page-nav .nav-dir { + color: var(--fg-dim); + font-size: 11px; + display: block; + letter-spacing: 0.08em; + margin-bottom: 4px; +} + +.page-nav .next { text-align: right; } + +/* ── Lists ─────────────────────────────────────── */ +ul, ol { padding-left: 24px; } +ul li, ol li { margin: 6px 0; } + +/* ── Utility ───────────────────────────────────── */ +.mono { font-family: var(--mono); } +.dim { color: var(--fg-dim); } +.accent { color: var(--accent); } +.warn { color: var(--warn); } + +.tag { + display: inline-block; + font-family: var(--mono); + font-size: 11px; + padding: 2px 8px; + border: 1px solid var(--border); + border-radius: 2px; + color: var(--fg-dim); + margin-right: 4px; + letter-spacing: 0.04em; +} +.tag.accent { color: var(--accent); border-color: var(--accent); } + +.stat-row { + display: flex; + gap: 24px; + flex-wrap: wrap; + margin: 20px 0; +} +.stat { + border: 1px solid var(--border); + padding: 14px 20px; + background: var(--bg-alt); + min-width: 140px; +} +.stat .stat-value { + font-family: var(--mono); + font-size: 24px; + color: var(--accent); + display: block; +} +.stat .stat-label { + font-family: var(--mono); + font-size: 11px; + color: var(--fg-dim); + text-transform: uppercase; + letter-spacing: 0.08em; +} + +/* ── Responsive ─────────────────────────────────── */ +@media (max-width: 720px) { + .site-header { + flex-direction: column; + gap: 12px; + padding: 14px 16px; + } + .site-nav { justify-content: center; } + main { padding: 36px 18px; } + h1 { font-size: 26px; } + h2 { font-size: 19px; } + .hero { padding: 22px; } + .page-nav { flex-direction: column; } + .page-nav a { max-width: 100%; } +} diff --git a/site/index.html b/site/index.html new file mode 100644 index 0000000..206e4d1 --- /dev/null +++ b/site/index.html @@ -0,0 +1,142 @@ + + + + + + CL4R1T4S // ANALYSIS — AI システムプロンプトを読み解く + + + + +
+
CL4R1T4S//ANALYSIS
+ +
+ +
+
+
// CLASSIFICATION: leaked system prompts  //  VENDORS: 26  //  LINES: 16,798
+

AI の"楽屋裏の台本"を読む

+

> 普段ユーザーからは見えない、主要 AI モデルのシステムプロンプトを 6 つのテーマで解剖する。

+

+ CL4R1T4S は、OpenAI / Anthropic / Google / xAI / Meta / Mistral、そして主要なコーディングエージェント（Cursor, Devin, Cline ほか）など、 + 公開されていない システムプロンプト をリーク・リバースエンジニアリングで収集したアーカイブです。 + 本サイトはその内容を分析・構造化し、日本語で解説したものです。 +

+

+ "In order to trust the output, one must understand the input." +

+
+ +

このリポジトリから読み取れること

+

+ AI の振る舞い——何を言い、何を言わないか／どんな口調で／どんな道具を使って——は、 + モデル本体のパラメータだけでなく、ユーザーから見えない「システムプロンプト層」で強く規定されています。 + 各ベンダーのプロンプトを並べて比較すると、表に出ない 設計思想・倫理観・機能の境界線 が浮かび上がります。 +

+ +
+
+ 26 + Vendors +
+
+ ~80 + Prompt Files +
+
+ 16,798 + Total Lines +
+
+ 6 + Analysis Themes +
+
+ +

6 つの切り口

+

以下のカードから、各テーマの詳細ページへ進めます。

+ +
+ +
// 01
+

禁則・拒否ルール

+

「何を言わないように作られているか」。児童安全・CBRN・著作権・政治——各社の拒否ポリシーを横並び比較。Anthropic の多重ガードから Meta の "never refuse" まで、同じ話題に対する真逆の指示を可視化する。

+ + +
// 02
+

人格設計

+

温度・トーン・口調はプロンプトで矯正される。ChatGPT "personality v2" による人格バージョン管理、Grok の反 PC 宣言、Hume の「5 語以下で返答を始めよ」——人格の"外付け性"を読み解く。

+ + +
// 03
+

ツール使用ロジック

+

Web 検索・メモリ・画像生成・ブラウザ操作・アーティファクト生成。各ツールの"いつ使うか"の判断基準までプロンプトで細かく縛られている。GPT-4o 画像生成後の「完全沈黙」指示など、異様なケースも。

+ + +
// 04
+

ベンダー別設計哲学

+

Anthropic は多重ガード、OpenAI は人格とプロダクト統合、xAI は真実追求、Google は生成 UI、Meta は refuse 禁止、中国系は学術的厳密さ——各社の哲学の違いがプロンプトににじみ出ている。

+ + +
// 05
+

プロンプトの進化史

+

Claude 3.5 → 4.7、Grok 3 → 4.20 のような同一系統の版間差分から、何が追加・削除されたかが追える。「新機能よりガードレール追加の方が速い」という共通傾向も見えてくる。

+ + +
// 06
+

業界トレンド

+

ブラウザ内蔵 AI（Atlas / Dia / Leo）、自律エージェント（Manus / Devin / DROID）、UI 生成型コーディング（Bolt / v0 / Lovable）、中国モデルの台頭——副産物として見える業界地図。

+ +
+ +

アーカイブの規模感

+ + + + + + + + + + + +
カテゴリ件数代表的な収録
ベンダー / 製品26OpenAI, Anthropic, Google, xAI, Meta, Mistral, Moonshot, MiniMax ほか
主要モデル30+Claude Opus 4.7, GPT-5, Gemini 2.5 Pro, Grok 4.20, Kimi K2, LeChat ほか
コーディングエージェント10+Cursor 2.0, Devin 2.0, Cline, Windsurf, Bolt, v0, Lovable, Replit Agent ほか
ブラウザ / OS 統合4OpenAI Atlas, Dia, Brave Leo, Gemini Gmail Assistant
総行数16,798.txt / .md / .mkd (コード類は含まず)
+ +

このサイトの読み方

+ + +
+ ⚠ NOTE: + 元リポジトリの README.md には、AI アシスタントを標的にしたプロンプトインジェクション文字列が含まれていました（本ブランチでは削除済み）。 + CL4R1T4S の内容を他のエージェントに読み込ませる際には、同様の注入攻撃が仕込まれている可能性を想定してください。 +
+ +
+ 出典について: + 本サイト上のすべての引用・解釈は、CL4R1T4S リポジトリに含まれるテキストファイルを一次ソースとしています。 + 各プロンプトの著作権は各ベンダーに帰属し、本サイトは教育 / 研究目的の二次的な解説です。 +
+
+ + + +