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>

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>
+  );
+}