New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Jungian Archetypes

by HermeticOrmus in HermeticOrmus/LibreUIUX-Claude-Code

The twelve Jungian brand archetypes mapped to UI structure: layout, typography, motion, and interaction patterns for each.

MITAuto-check passedFrontend & Design

Install Jungian Archetypes

skills CLI
$ npx skills add HermeticOrmus/LibreUIUX-Claude-Code --skill jungian-archetypes -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install HermeticOrmus/LibreUIUX-Claude-Code jungian-archetypes --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/HermeticOrmus/LibreUIUX-Claude-Code.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/archetypal-alchemy/skills/jungian-archetypes .claude/skills/jungian-archetypes && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
jungian-archetypes
GitHub stars
112
Token cost
~2.5k tokens
SKILL.md length
788 words
Files
2 (incl. assets)
Skills in repo
15
Repo updated
First seen
Licence
MIT

At a glance

The twelve Jungian brand archetypes mapped to UI structure: layout, typography, motion, and interaction patterns for each.

  • Works in 12 steps: THE HERO → THE MAGICIAN → THE SAGE → …
  • Product is framed as an archetype (Hero
  • SKILL.md covers Overview, The 12 Archetypes, Using Archetypes in Design and Design Translation Framework
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Jungian Archetypes is an agent skill from HermeticOrmus/LibreUIUX-Claude-Code. The twelve Jungian brand archetypes mapped to UI structure: layout, typography, motion, and interaction patterns for each. Use when a brand or product is framed as an archetype (Hero, Sage, Rebel, Caregiver, and so on) and the interface should behave like it.

Its SKILL.md is about 2.5k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including assets (for example `assets/archetype-cheatsheet.md`).

It sits in Frontend & Design, covering Typography. The repository describes itself as: UI/UX system for Claude Code: 71 plugins, 93 agents, 74 skills. Design mastery, archetypal design, accessibility, and frontend workflows in one validated plugin marketplace. The licence is MIT.

When your agent uses it

  • Product is framed as an archetype (Hero
  • So on) and the interface should behave like it

Example prompts

  • “/jungian-archetypes”

Workflow steps

12 steps, taken from the step headings in SKILL.md.

  1. THE HERO
  2. THE MAGICIAN
  3. THE SAGE
  4. THE INNOCENT
  5. THE EXPLORER
  6. THE REBEL
  7. THE LOVER
  8. THE CREATOR
  9. THE JESTER
  10. THE CAREGIVER
  11. THE RULER
  12. THE EVERYMAN

What it can do on your machine

Read from SKILL.md and the folder at commit 41a968c. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are tailwind).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Jungian Archetypes loads about 2.5k tokens when it runs. Until then it costs about 70 tokens; SKILL.md has 788 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~70
When it runs · the whole SKILL.md, loaded when a task matches
~2.5k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from HermeticOrmus/LibreUIUX-Claude-Code at commit 41a968c, republished under its MIT licence (© HermeticOrmus). 788 words, ~2,545 tokens.

Download SKILL.mdSave it as .claude/skills/jungian-archetypes/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
jungian-archetypes
description
The twelve Jungian brand archetypes mapped to UI structure: layout, typography, motion, and interaction patterns for each. Use when a brand or product is framed as an archetype (Hero, Sage, Rebel, Caregiver, and so on) and the interface should behave like it.

Jungian Archetypes → UI/UX Aesthetics

Overview

The 12 Jungian archetypes represent universal patterns of human behavior and motivation. Each archetype carries distinct visual languages, interaction patterns, and design philosophies that can be translated into UI/UX systems.

The 12 Archetypes

1. THE HERO

Core Drive: Mastery, courage, achievement Visual Language: Bold, angular, dynamic UI Characteristics:

  • Strong geometric shapes (triangles, sharp edges)
  • High contrast ratios (dark/light extremes)
  • Action-oriented CTAs ("Conquer", "Achieve", "Master")
  • Progress indicators and achievement badges
  • Competitive elements and leaderboards

Typography: Bold sans-serif, uppercase headers, tight tracking Layout: Asymmetric grids, diagonal elements, dynamic tension Spacing: Tight, energetic, purposeful Motion: Fast transitions, bold animations, directional movement

Example Patterns:

tailwind
Hero Button: bg-red-600 hover:bg-red-700 px-8 py-4 text-xl font-bold uppercase tracking-wider transform hover:scale-105
Hero Card: border-l-4 border-red-600 bg-zinc-900 shadow-2xl
2. THE MAGICIAN

Core Drive: Transformation, knowledge, power Visual Language: Mysterious, sophisticated, transformative UI Characteristics:

  • Gradients and transformations
  • Interactive reveals and discoveries
  • Mystical symbols and sacred geometry
  • "Behind the curtain" progressive disclosure
  • Transformation metaphors (before/after)

Typography: Serif display fonts, elegant script accents, varying weights Layout: Centered compositions, radial symmetry, layered depth Spacing: Generous, intentional negative space Motion: Smooth morphing, particle effects, magical reveals

Example Patterns:

tailwind
Magician Card: bg-gradient-to-br from-purple-900 via-indigo-800 to-blue-900 backdrop-blur-xl
Transformation Button: group relative overflow-hidden [child transitions]
3. THE SAGE

Core Drive: Truth, wisdom, understanding Visual Language: Clean, minimal, scholarly UI Characteristics:

  • Information hierarchy emphasized
  • Clear categorization and taxonomy
  • Reading-focused layouts
  • Knowledge graphs and connections
  • Citation and reference systems

Typography: Humanist serif for body, geometric sans for UI Layout: Grid-based, predictable, spacious margins Spacing: Academic spacing ratios (1.5-2x line height) Motion: Minimal, purposeful, never decorative

Example Patterns:

tailwind
Sage Container: max-w-prose mx-auto leading-relaxed text-zinc-700 dark:text-zinc-300
Sage Navigation: border-b border-zinc-200 bg-white/80 backdrop-blur-sm
4. THE INNOCENT

Core Drive: Safety, happiness, simplicity Visual Language: Soft, friendly, accessible UI Characteristics:

  • Rounded corners everywhere
  • Pastel color palettes
  • Friendly illustrations and icons
  • Simple, clear language
  • Encouraging feedback messages

Typography: Rounded sans-serif, friendly weights (400-600) Layout: Symmetric, centered, balanced Spacing: Generous padding, comfortable breathing room Motion: Gentle bounces, playful micro-interactions

Example Patterns:

tailwind
Innocent Button: bg-sky-400 hover:bg-sky-500 rounded-full px-6 py-3 shadow-sm
Innocent Card: bg-white rounded-3xl p-8 shadow-md border-2 border-sky-100
5. THE EXPLORER

Core Drive: Discovery, freedom, adventure Visual Language: Open, expansive, journey-focused UI Characteristics:

  • Map metaphors and navigation
  • Journey/path visualizations
  • Discovery-based navigation
  • Breadcrumbs and waypoints
  • Exploration rewards

Typography: Adventure-inspired fonts, slightly condensed Layout: Horizontal scrolling, panoramic views, map-like Spacing: Open, airy, suggesting vast spaces Motion: Parallax scrolling, zooming transitions

Example Patterns:

tailwind
Explorer Header: h-screen bg-cover bg-fixed bg-center [parallax effect]
Explorer Card: hover:scale-105 cursor-pointer transition-transform
6. THE REBEL

Core Drive: Revolution, disruption, liberation Visual Language: Unconventional, edgy, rule-breaking UI Characteristics:

  • Asymmetric layouts
  • Unexpected interactions
  • Glitch effects and disruption
  • Counter-cultural messaging
  • Break-the-grid moments

Typography: Industrial fonts, distressed effects, mixed cases Layout: Broken grids, chaotic energy, intentional disorder Spacing: Variable, unpredictable, tension-creating Motion: Glitch animations, unexpected movements, disruption

Example Patterns:

tailwind
Rebel Section: -rotate-2 border-4 border-black bg-yellow-400 [brutalist style]
Rebel Text: font-mono uppercase tracking-widest [glitch-effect]
7. THE LOVER

Core Drive: Intimacy, beauty, sensuality Visual Language: Elegant, sensual, emotionally resonant UI Characteristics:

  • Rich textures and gradients
  • Romantic color palettes
  • Emphasis on imagery
  • Emotional storytelling
  • Luxurious details

Typography: Elegant serifs, script accents, refined proportions Layout: Flowing, organic, rhythm-based Spacing: Intimate, considered, luxurious Motion: Smooth, sensual, flowing transitions

Example Patterns:

tailwind
Lover Card: bg-gradient-to-br from-rose-100 to-pink-200 backdrop-blur-lg
Lover Typography: font-serif text-rose-900 leading-loose
8. THE CREATOR

Core Drive: Innovation, imagination, self-expression Visual Language: Artistic, experimental, expressive UI Characteristics:

  • Canvas/workspace metaphors
  • Tool palettes and makers' interfaces
  • Creative freedom in interaction
  • Process visualization
  • Experimentation encouraged

Typography: Creative variety, expressive mixing Layout: Flexible grids, tool-based layouts Spacing: Functional, workspace-like Motion: Responsive to creation, playful feedback

Example Patterns:

tailwind
Creator Workspace: grid grid-cols-12 gap-4 bg-zinc-50 [maker interface]
Creator Tool: hover:bg-zinc-200 active:bg-zinc-300 cursor-pointer
Show full SKILL.md (296 more words)Show less
9. THE JESTER

Core Drive: Joy, playfulness, entertainment Visual Language: Playful, energetic, surprising UI Characteristics:

  • Unexpected delights and easter eggs
  • Gamification elements
  • Humor in microcopy
  • Playful animations
  • Colorful, energetic palettes

Typography: Playful fonts, varying sizes, energetic rhythm Layout: Dynamic, asymmetric, entertaining Spacing: Energetic, varied, rhythmic Motion: Bouncy, exaggerated, delightful

Example Patterns:

tailwind
Jester Button: animate-bounce bg-gradient-to-r from-pink-500 to-yellow-500
Jester Card: rotate-1 hover:rotate-0 [playful tilt]
10. THE CAREGIVER

Core Drive: Service, compassion, nurturing Visual Language: Warm, supportive, accessible UI Characteristics:

  • Clear help and support systems
  • Empathetic messaging
  • Accessibility-first design
  • Supportive feedback
  • Community-building features

Typography: Warm, readable, comfortable fonts Layout: Organized, predictable, safe Spacing: Comfortable, generous, never cramped Motion: Gentle, supportive, never jarring

Example Patterns:

tailwind
Caregiver Section: bg-amber-50 border-l-4 border-amber-400 p-6
Caregiver Message: text-amber-900 leading-relaxed [supportive tone]
11. THE RULER

Core Drive: Control, order, leadership Visual Language: Authoritative, prestigious, structured UI Characteristics:

  • Hierarchical organization
  • Premium materials and finishes
  • Control panel metaphors
  • Status indicators
  • Command-and-control interfaces

Typography: Prestigious serifs, strong hierarchy Layout: Strict grids, formal symmetry Spacing: Precise, authoritative Motion: Dignified, controlled, purposeful

Example Patterns:

tailwind
Ruler Dashboard: bg-zinc-900 border border-amber-600/20 [premium dark]
Ruler Typography: font-serif text-amber-500 tracking-wide uppercase
12. THE EVERYMAN

Core Drive: Belonging, connection, community Visual Language: Familiar, unpretentious, approachable UI Characteristics:

  • Familiar patterns (no surprises)
  • Community features
  • Social proof elements
  • Conversational tone
  • Democratic design

Typography: Familiar system fonts, comfortable sizes Layout: Conventional grids, predictable patterns Spacing: Standard, comfortable, familiar Motion: Expected, never surprising

Example Patterns:

tailwind
Everyman Container: bg-white rounded-lg shadow p-6 [familiar card]
Everyman Button: bg-blue-600 hover:bg-blue-700 [standard primary]

Using Archetypes in Design

Single Archetype Application

Use one archetype as the dominant design voice:

/archetypal-ui hero
→ Generates Hero-driven design system
Archetype Blending

Combine 2-3 archetypes for nuanced personalities:

Hero (70%) + Magician (30%) = Transformative achievement platform
Sage (60%) + Caregiver (40%) = Supportive educational experience
Archetype + Major Arcana

Combine archetype (structure) with Tarot card (color/mood):

Hero + Sun = Bold, victorious, golden
Magician + Moon = Mysterious, transformative, silver-blue
Sage + Hermit = Contemplative, minimal, deep purple

Design Translation Framework

When applying an archetype:

  1. Identify Core Drive - What motivates this user?
  2. Visual Language - What aesthetic resonates?
  3. UI Patterns - Which interaction patterns serve this drive?
  4. Typography - What font personality matches?
  5. Motion - How should things move?
  6. Color - Add Major Arcana for palette (see major-arcana skill)

"The archetype is not a metaphor—it is the pattern itself, manifesting through pixels and interactions."

© HermeticOrmus, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 1 other file (assets) in plugins/archetypal-alchemy/skills/jungian-archetypes of HermeticOrmus/LibreUIUX-Claude-Code.

  • SKILL.md
  • assets/archetype-cheatsheet.md

Open the folder on GitHubat commit 41a968c

Compare with similar skills

Jungian Archetypes next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Jungian Archetypes compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Jungian Archetypes this skillHermeticOrmus/LibreUIUX-Claude-Code112—~2.5kAutomated safety check: PassMIT
Impeccablebestofjs/bestofjs3.1k26 repos~2.6kAutomated safety check: PassMIT
Tailwindcss Developmentanonaddy/anonaddy4.9k10 repos~865Automated safety check: PassMIT
Design SystemOhh-889/skyroc79511 repos~1.7kAutomated safety check: PassMIT
Make Interfaces Feel Bettersamuelclay/NewsBlur7.6k10 repos~1.5kAutomated safety check: PassMIT
UI UX Pro Maxsaoudi-h/solar-icons19018 repos~11kAutomated safety check: NotesCustom licence

Similar skills

  • Impeccable

    bestofjs/bestofjs

    A skill your agent uses when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a…

    3.1k GitHub starsUsed in 26 repos~2.6k tokens
    Frontend & DesignAuto-check passed

  • Tailwindcss Development

    anonaddy/anonaddy

    Always invoke when the user's message includes 'tailwind' in any form.

    4.9k GitHub starsUsed in 10 repos~865 tokens
    Frontend & DesignAuto-check passed

  • Design System

    Ohh-889/skyroc

    Token architecture, component specifications, and slide generation.

    795 GitHub starsUsed in 11 repos~1.7k tokens
    Frontend & DesignAuto-check passed

  • Make Interfaces Feel Better

    samuelclay/NewsBlur

    Design engineering principles for making interfaces feel polished.

    7.6k GitHub starsUsed in 10 repos~1.5k tokens
    Frontend & DesignAuto-check passed

  • UI UX Pro Max

    saoudi-h/solar-icons

    UI/UX design intelligence for web and mobile. An agent skill from saoudi-h/solar-icons.

    190 GitHub starsUsed in 18 repos~11k tokens
    Frontend & DesignAuto-check: notes

  • Baseline UI

    ibelick/ui-skills

    Applies a fixed set of UI rules for stack, components, interaction, animation, typography and layout, or reviews a file against them with concrete fixes.

    9.6k GitHub starsUsed in 8 repos~855 tokens
    Frontend & DesignAuto-check passed

More from HermeticOrmus/LibreUIUX-Claude-Code

All 15 skills in this repo

  • Deployment Pipeline Design

    HermeticOrmus/LibreUIUX-Claude-Code

    Design multi-stage CI/CD pipelines with approval gates, security checks, and deployment orchestration.

    112 GitHub starsUsed in 11 repos~2.1k tokens
    Auto-check passed

  • Multi Cloud Architecture

    HermeticOrmus/LibreUIUX-Claude-Code

    Design multi-cloud architectures using a decision framework to select and integrate services across AWS, Azure, and GCP.

    112 GitHub starsUsed in 11 repos~1.2k tokens
    Auto-check passed

  • Archetypal Combinations

    HermeticOrmus/LibreUIUX-Claude-Code

    Rules and worked examples for combining an archetype (structure and behavior) with a Major Arcana card (color and mood) into one coherent design system.

    112 GitHub stars~3.4k tokensUpdated 6 days ago
    Auto-check passed

  • Langchain Architecture

    HermeticOrmus/LibreUIUX-Claude-Code

    Design LLM applications using the LangChain framework with agents, memory, and tool integration patterns.

    112 GitHub starsUsed in 10 repos~2.5k tokens
    Auto-check passed

  • Brand Systems

    HermeticOrmus/LibreUIUX-Claude-Code

    Brand identity building blocks: positioning, personality, archetypes, logo systems, color palettes, type pairing, voice, and guidelines documentation.

    112 GitHub stars~2.3k tokensUpdated 6 days ago
    Auto-check passed

  • Design Principles

    HermeticOrmus/LibreUIUX-Claude-Code

    Core visual design principles (visual hierarchy, Gestalt grouping, composition, balance, contrast, white space, color, typography) with UI fixes, a checklist, and deep-dive references.

    112 GitHub stars~2k tokensUpdated 6 days ago
    Auto-check passed

Categories

Questions about Jungian Archetypes

What does Jungian Archetypes do?

The twelve Jungian brand archetypes mapped to UI structure: layout, typography, motion, and interaction patterns for each. Jungian Archetypes is an agent skill from HermeticOrmus/LibreUIUX-Claude-Code. The twelve Jungian brand archetypes mapped to UI structure: layout, typography, motion, and interaction patterns for each.

When should I use Jungian Archetypes?

Jungian Archetypes fits situations like: product is framed as an archetype (Hero; so on) and the interface should behave like it.

How do I install Jungian Archetypes in Claude Code?

Run `npx skills add HermeticOrmus/LibreUIUX-Claude-Code --skill jungian-archetypes -a claude-code`. Or copy the skill folder (plugins/archetypal-alchemy/skills/jungian-archetypes in HermeticOrmus/LibreUIUX-Claude-Code) into .claude/skills/jungian-archetypes in your project. Claude Code loads it when a task matches its description.

How do I install Jungian Archetypes in Codex?

Run `npx skills add HermeticOrmus/LibreUIUX-Claude-Code --skill jungian-archetypes -a codex`. Or copy the skill folder (plugins/archetypal-alchemy/skills/jungian-archetypes in HermeticOrmus/LibreUIUX-Claude-Code) into .agents/skills/jungian-archetypes in your project. Codex loads it when a task matches its description.

Can I use Jungian Archetypes in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add HermeticOrmus/LibreUIUX-Claude-Code --skill jungian-archetypes -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/jungian-archetypes, .gemini/skills/jungian-archetypes, .github/skills/jungian-archetypes and .opencode/skills/jungian-archetypes in your project.

What does Jungian Archetypes need to run?

SKILL.md names no scripts, command-line tools or credentials: Jungian Archetypes is instructions for the agent only.

Does Jungian Archetypes access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Jungian Archetypes safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Jungian Archetypes use?

Jungian Archetypes is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Jungian Archetypes use?

About 2.5k tokens (SKILL.md is roughly 10k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Jungian Archetypes?

Skills that share tags, products or a category with Jungian Archetypes: Impeccable (bestofjs/bestofjs, 3.1k stars), Tailwindcss Development (anonaddy/anonaddy, 4.9k stars), Design System (Ohh-889/skyroc, 795 stars) and Make Interfaces Feel Better (samuelclay/NewsBlur, 7.6k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Jungian Archetypes?

HermeticOrmus (a GitHub user) maintains it in HermeticOrmus/LibreUIUX-Claude-Code, which has 112 GitHub stars. The repository holds 15 skills in this directory. The repository was last updated on October 4, 2026.

Source: HermeticOrmus/LibreUIUX-Claude-Code on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.