avatar-profile
Avatar design, profile displays, user representation, initials fallback, and presence indicators.
Skill by Dragoon0x
Chalk Labs
Need help deploying avatar-profile?
Chalk Labs sets up agents like this inside real teams: connected to your tools, tested on your data, with a human in the loop where it matters.
Install
Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.
npx agentmarket install skill/dragoon0x-avatar-profile
Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.
Get the weekly diff
The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.
About
Use cases: design
Reviews
Write a reviewNo reviews yet. Installed it? Reviews come from verified installers only. How reviews work
Permissions
What this skill can do and what it asks for, from its SKILL.md. Checked Oct 25, 2026.
- Tools
- No tools found
- Secrets
- None asked for
- Install scripts
- None found
Network hosts it talks to 1
codeload.github.com· found in install command
Files it touches
~/.claude/skills/avatar-profile
What's inside
- Skill name
avatar-profile- Description
- Avatar design, profile displays, user representation, initials fallback, and presence indicators.
- License
- MIT
- Instructions
- 37 lines in SKILL.md · view on GitHub
Files (1)
- SKILL.md
SKILL.md (first lines)
# Avatar & Profile Patterns ## Avatar Sizes | Size | Use Case | Pixels | |------|----------|--------| | XS | Dense lists, inline mentions | 24px | | SM | Comments, chat messages | 32px | | MD | Cards, list items | 40px | | LG | Profile headers, sidebars | 56-64px | | XL | Profile pages, account settings | 96-128px | ## Fallback Chain 1. User-uploaded photo 2. Initials on colored background (derived from name hash for consistency) 3. Generic silhouette icon (absolute last resort) ## Initials - Use first letter of first and last name (JD for John Doe) - Single name: use first two letters (JO for John) - Background color: derive from a hash of the name (same person = same color always) - Text color: white on dark backgrounds, dark on light ## Presence Indicators - Green dot: online/active - Yellow dot: idle/away - Red dot: busy/do not disturb - Gray dot or no dot: offline - Position: bottom-right corner of avatar - Size: 25-30% of avatar diameter ## Group Avatars - Stack with overlap (show 3, "+5 more") - Overlap from left to right - Most recent or most relevant on top - Click to expand full list
From Dragoon0x/everything-design-taste, MIT.
More from Dragoon0x/everything-design-taste
- 0.449score
case-study-writing
Dragoon0x
Honest, structured case study writing that shows real impact.
SkillDFreshness: D★ 13Claude Code +9 - 0.449score
anti-slop
Dragoon0x
Detecting and eliminating generic AI-generated aesthetics, writing patterns, and design defaults.
SkillDFreshness: D★ 13Claude Code +9 - 0.449score
competitive-teardown
Dragoon0x
Structured analysis of competing products covering UX patterns, design quality, positioning, and strategic differentiation opportunities.
SkillDFreshness: D★ 13Claude Code +9 - 0.449score
configure-edt
Dragoon0x
Interactive setup wizard for Everything Design Code.
SkillDFreshness: D★ 13Claude Code +9 - 0.449score
accessibility-deep-patterns
Dragoon0x
Advanced accessibility patterns including ARIA, screen reader optimization, cognitive accessibility, and motor impairment design.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
ai-product-design
Dragoon0x
Designing AI-powered features, managing user expectations, and AI transparency.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
accordion-patterns
Dragoon0x
Accordion and collapsible content patterns, FAQ layouts, and progressive disclosure.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
aspect-ratio-design
Dragoon0x
Image and media aspect ratio standards, responsive aspect ratios, and consistent media sizing.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
analytics-reporting-design
Dragoon0x
Analytics and reporting interface design including data visualization, report builder, and metric dashboards.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
authentication-flow
Dragoon0x
Login, signup, password reset, SSO, MFA, and authentication UX patterns.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
animation-choreography
Dragoon0x
Page transition choreography, staggered animations, and orchestrated motion sequences.
SkillDFreshness: D★ 13Claude Code +9 - 0.446score
ar-vr-interface
Dragoon0x
AR/VR interface design, spatial UI, 3D interaction patterns, and immersive UX.
SkillDFreshness: D★ 13Claude Code +9
Signals
- Stars
- 13
- Forks
- 1
- Open issues
- 0
- Last commit (this folder)
- Apr 11, 2026 (6 months ago)
From GitHub (fetched Oct 24, 2026).
Details
- License
- MIT
- First seen
- Oct 24, 2026
- Last checked
- Oct 24, 2026
- Source
- GitHubgithub-graphql
More from Dragoon0x
- 0.492score
color
Dragoon0x
Generate a color palette token file (CSS variables, tailwind config, or JS module) from the palette detected by /scan.
SkillCFreshness: C★ 4Claude Code +9 - 0.492score
benchmark
Dragoon0x
Snapshot codebase metrics (file count, total lines, /critique scores) for trend tracking.
SkillCFreshness: C★ 4Claude Code +9 - 0.492score
brief
Dragoon0x
Generate a structured product brief markdown from a one-line idea, pre-filled with codebase facts (stack, type system, palette, components count) from…
SkillCFreshness: C★ 4Claude Code +9 - 0.492score
autoplan
Dragoon0x
Run /brief, /plan-eng, and /plan-design in one shot to bootstrap a complete sprint plan.
SkillCFreshness: C★ 4Claude Code +9 - 0.492score
careful
Dragoon0x
Write a checklist of destructive commands the user wants to think twice about (rm -rf, force push, hard reset, db drop, etc.) to .dragoon/CAREFUL.md.
SkillCFreshness: C★ 4Claude Code +9 - 0.492score
component
Dragoon0x
Generate a UI component scaffold in the codebase's actual style.
SkillCFreshness: C★ 4Claude Code +9
Done for you
Rather not set it up yourself?
Chalk Labs scopes, builds and runs agents for your team: the task audit, the eval harness, the integrations and the weekly ops report. Fixed scope, priced before we start.
See how we build AI agents →Read the case studies
Chalk Labs is a two-founder AI and growth studio. We build AI agents, CRMs and MVPs for Web3 and AI companies, and have shipped 50+ product and token launches.
- launches shipped
- 50+
- launches shipped
- media placements
- 500+
- media placements
- founders on every account
- 2
- founders on every account
Press we've placed: Forbes · CoinDesk · Decrypt · Cointelegraph · The Block
Rahil Jain, Co-founder, Chalk Labs. Ex-Goldman Sachs engineer. You talk to the person who builds it.
Get avatar-profile running in your business
Tell us what you want to automate. A founder replies within one working day with a plan, not a pitch deck.
Cite this page
avatar-profile skill. Agent Mart. https://agentmart.dev/skills/dragoon0x-avatar-profile (last updated 2026-10-24)