Skills

Personal Website

Generate a beautiful personal homepage (linktree-style) and publish it online for the...

Install

npx skills add clacky-ai/openclacky --skill personal-website -g -a claude-code -y
Repository
clacky-ai/openclacky1.2k
Category
AI and agents
Updated
5d ago
License
MIT
Context cost
Lightabout 817 tokens
Runs scripts
Yes, review before use

What it does

Generate a beautiful personal homepage (linktree-style) and publish it online for the user. Reads user info from ~/.clacky/agents/USER.md and AI info from ~/.clacky/agents/SOUL.md. Returns a public URL the user can share. Trigger on: "profile card", "homepage", "personal page", "generate my card", "make my card", "publish my card", "生成名片", "做名片", "我的名片", "个人主页", "发布主页", "delete my card", "删除名片", "删除主页".

Profile Homepage Skill

Generate a beautiful personal homepage and publish it at a public URL.


Step 1, Read user info

Read ~/.clacky/agents/USER.md and ~/.clacky/agents/SOUL.md.

Extract everything you can find:

  • name, display name (fallback: "Friend")
  • occupation, job title or role (fallback: "")
  • bio, short personal description (fallback: "")
  • links, all social/contact links found, preserve their labels. Common ones to look for: GitHub, Twitter/X, LinkedIn, Website, Blog, Email, Instagram, YouTube, Telegram, WeChat, etc. Each link: { label, url, type } where type helps pick an icon emoji.
  • ai_name, AI assistant name from SOUL.md (fallback: "Clacky")
  • personality, professional / friendly / creative / concise (from SOUL.md, fallback: "friendly")

Step 2, Handle delete request

If the user asked to delete their homepage:

  1. Find the skill's own directory (same folder as this SKILL.md). Call it SKILL_DIR.
  2. Run:
    ruby SKILL_DIR/publish.rb delete
    
    The script reads the slug automatically from ~/clacky_workspace/personal_website/token.json.
  3. Tell the user their homepage has been removed. Stop here.

Step 3, Design & generate the HTML

Write a complete, self-contained HTML file to /tmp/profile-card.html.

You have full creative freedom on:

  • Layout, typography, spacing, color palette
  • Background (solid / gradient / subtle pattern / animated)
  • Link button style (pill / card / underline / ghost / anything)
  • Avatar treatment (large initial letter with color, emoji, geometric shape, no real image needed)
  • Animations (subtle hover effects, entrance fade, etc.)
  • Overall vibe, make it feel like a real personal brand page, not a template
Read the whole SKILL.md on GitHub

More in AI and agents