docs: list the built-in Skills in the READMEs and on the landing page (#23)

Co-authored-by: Alice <alice@prismshadow.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

README.md

@@ -66,6 +66,17 @@ With PenguinHarness Skills, an Agent evaluates and optimizes itself: run the ben
 
 https://github.com/user-attachments/assets/922d13a6-5ffc-4685-9a39-352f02f9afc0
 
+## Built-in Skills
+
+Four Skill groups ship in the box ([docs](https://penguin.ooo/docs/skills)); Agents can also write and optimize their own:
+
+| Group                | Skills                                                                            |
+| -------------------- | --------------------------------------------------------------------------------- |
+| Office Productivity  | `data-analysis`, `firecrawl`                                                      |
+| Software Development | `web-design`, `software-engineering`                                              |
+| AI App Development   | `penguin-sdk`, `penguin-cli`, `agenthub-models`                                   |
+| Agent Tuning         | `agent-creation`, `benchmark-design`, `agent-evaluation`, `agent-optimization`    |
+
 ## Supported Models
 
 | Model            | Providers                                                                        |

README.zh.md

@@ -66,6 +66,17 @@ https://github.com/user-attachments/assets/604eb626-0a5d-4a62-87e3-14ebade1cd5f
 
 https://github.com/user-attachments/assets/aec49ae9-b743-467b-b247-37bedfeaa36e
 
+## 内置 Skill 库
+
+开箱内置四组 Skill（[文档](https://penguin.ooo/docs/skills)），Agent 也能编写并优化自己的 Skill：
+
+| 分组        | Skill                                                                          |
+| ----------- | ------------------------------------------------------------------------------ |
+| 办公效率    | `data-analysis`、`firecrawl`                                                   |
+| 软件开发    | `web-design`、`software-engineering`                                           |
+| AI 应用开发 | `penguin-sdk`、`penguin-cli`、`agenthub-models`                                |
+| Agent 调优  | `agent-creation`、`benchmark-design`、`agent-evaluation`、`agent-optimization` |
+
 ## 支持的模型
 
 | 模型             | 可用供应商                                                                       |

packages/landing/src/lib/strings-en.ts

@@ -335,6 +335,21 @@ export const en: Strings = {
     ],
   },
 
+  skills: {
+    eyebrow: "Built-in Skills",
+    title: "The built-in Skill library at a glance",
+    subtitle: "Four Skill groups out of the box — Agents can write and optimize their own, too.",
+    groups: [
+      { title: "Office Productivity", skills: ["data-analysis", "firecrawl"] },
+      { title: "Software Development", skills: ["web-design", "software-engineering"] },
+      { title: "AI App Development", skills: ["penguin-sdk", "penguin-cli", "agenthub-models"] },
+      {
+        title: "Agent Tuning",
+        skills: ["agent-creation", "benchmark-design", "agent-evaluation", "agent-optimization"],
+      },
+    ],
+  },
+
   security: {
     eyebrow: "Security",
     title: "Evolution within bounds, data within walls",

packages/landing/src/lib/strings.ts

@@ -329,6 +329,21 @@ export const zh = {
     ],
   },
 
+  skills: {
+    eyebrow: "内置 Skill",
+    title: "内置 Skill 库一览",
+    subtitle: "四组 Skill 开箱即用，Agent 也能编写并优化自己的 Skill。",
+    groups: [
+      { title: "办公效率", skills: ["data-analysis", "firecrawl"] },
+      { title: "软件开发", skills: ["web-design", "software-engineering"] },
+      { title: "AI 应用开发", skills: ["penguin-sdk", "penguin-cli", "agenthub-models"] },
+      {
+        title: "Agent 调优",
+        skills: ["agent-creation", "benchmark-design", "agent-evaluation", "agent-optimization"],
+      },
+    ],
+  },
+
   security: {
     eyebrow: "安全",
     title: "进化不越界，数据不出域",

packages/landing/src/pages/home.tsx

@@ -8,6 +8,7 @@ import { Cases } from "../sections/cases";
 import { Benchmark } from "../sections/benchmark";
 import { Contract } from "../sections/contract";
 import { Features } from "../sections/features";
+import { Skills } from "../sections/skills";
 import { Security } from "../sections/security";
 import { Cta } from "../sections/cta";
 import { Community } from "../sections/community";
@@ -24,6 +25,7 @@ export function HomePage() {
       <Benchmark />
       <Contract />
       <Features />
+      <Skills />
       <Security />
       <Cta />
       <Community />

packages/landing/src/sections/skills.tsx

@@ -0,0 +1,35 @@
+/** Built-in Skill library at a glance: the four Skill groups with their member Skills as chips. */
+import { S } from "../lib/strings";
+import { Section } from "../components/section";
+
+export function Skills() {
+  return (
+    <Section
+      id="skills"
+      eyebrow={S.skills.eyebrow}
+      title={S.skills.title}
+      subtitle={S.skills.subtitle}
+    >
+      <div className="grid gap-5 sm:grid-cols-2 lg:grid-cols-4">
+        {S.skills.groups.map((group) => (
+          <article
+            key={group.title}
+            className="rounded-xl border border-gray-200 bg-white p-5 transition-colors hover:border-gray-300 dark:border-gray-800 dark:bg-gray-900 dark:hover:border-gray-700"
+          >
+            <h3 className="text-[15px] font-semibold tracking-tight">{group.title}</h3>
+            <ul className="mt-3 flex flex-wrap gap-1.5">
+              {group.skills.map((name) => (
+                <li
+                  key={name}
+                  className="rounded-full border border-gray-200 bg-gray-50 px-2.5 py-0.5 font-mono text-xs text-gray-600 dark:border-gray-800 dark:bg-gray-950 dark:text-gray-400"
+                >
+                  {name}
+                </li>
+              ))}
+            </ul>
+          </article>
+        ))}
+      </div>
+    </Section>
+  );
+}