This skill should be used when the user asks about "Notion icons", "page icons", "emoji icons", "icon consistency", "visual organization", "icon meaning", "database icons", "icon color coding",...
A comprehensive system for applying meaningful, consistent icons across a Notion workspace. Icons should communicate purpose at a glance while maintaining visual harmony.
Level 1: Structural (PARA sections) - Fixed, memorable
Level 2: Domain (Areas) - Distinctive per responsibility
Level 3: Type (Database items) - Consistent within collections
Level 4: Unique (One-off pages) - Descriptive of specific content
Notion supports four icon types:
// Standard Emoji
{ "type": "emoji", "emoji": "🏠" }
// External URL
{ "type": "external", "external": { "url": "https://..." } }
// Uploaded File
{ "type": "file_upload", "file_upload": { "id": "..." } }
// Workspace Custom Emoji
{ "type": "custom_emoji", "custom_emoji": { "id": "...", "name": "...", "url": "..." } }
Recommendation: Use standard emoji for maximum compatibility and minimal maintenance. Reserve custom/external icons for brand-specific needs.
Top-level PARA sections use fixed, instantly recognizable icons:
| Section | Icon | Rationale |
|---|---|---|
| Home | 🏠 | Universal "home base" recognition |
| Inbox | 📥 | Clearly "incoming/unprocessed" |
| Projects | 🚀 | Active, forward momentum |
| Areas | 🎯 | Ongoing focus/responsibility |
| Resources | 📚 | Knowledge library metaphor |
| Archives | 🗄️ | Storage/filing cabinet |
| Meta | ⚙️ | Configuration/system settings |
Rule: Never change these icons. They become navigation landmarks.
Each Area gets a distinctive icon reflecting its domain. Choose icons that are:
| Area | Primary | Alternatives | Rationale |
|---|---|---|---|
| Product | 📦 | 🎯, 💎 | Core deliverable/output |
| Engineering | 💻 | 🔧, ⚙️ | Technical work |
| Marketing | 📣 | 🎨, 🎯 | Communication/outreach |
| Operations | ⚡ | 🔄, 🏭 | Execution/process |
| Finance | 📊 | 💰, 🧮 | Numbers/analysis |
| Design | 🎨 | ✨, 🖼️ | Visual/creative |
| Sales | 🤝 | 💼, 📈 | Relationships/growth |
| Support | 🛟 | 🆘, 💬 | Assistance/help |
| Legal | ⚖️ | 📜, 🔒 | Compliance/contracts |
| HR/People | 👥 | 🧑🤝🧑, 💼 | Team/personnel |
Items within databases should have consistent icons based on their type property. This creates instant visual recognition when scanning database views.
| Type | Icon | Description |
|---|---|---|
| Spec | 📋 | Formal specifications, requirements |
| Guide | 📖 | How-to documentation, tutorials |
| Playbook | 📒 | Step-by-step procedures, runbooks |
| Reference | 🏷️ | Quick lookup, glossaries, lists |
| Template | 📝 | Reusable formats and structures |
| Concept | 💡 | Explanatory content, principles |
| Process | 🔄 | Workflow documentation |
| Policy | 📜 | Rules, guidelines, standards |
| Report | 📈 | Analysis, metrics, summaries |
| Archive | 📦 | Historical/deprecated content |
Use colored circles for project status (visible in list/board views):
| Status | Icon | Meaning |
|---|---|---|
| Not Started | ⚪ | Planned but not begun |
| Active | 🟢 | Currently in progress |
| On Hold | 🟡 | Paused, waiting on dependency |
| Blocked | 🔴 | Cannot proceed, needs resolution |
| Complete | ✅ | Successfully finished |
Track knowledge maturity using SECI-based icons:
| Phase | Icon | Meaning |
|---|---|---|
| Socialization | 💬 | Tacit, needs discussion/experience |
| Externalization | 📝 | Being documented, draft state |
| Combination | 🔗 | Synthesized, connected to other knowledge |
| Internalization | 🎯 | Actionable, ready for application |
| Priority | Icon | When to Use |
|---|---|---|
| Critical | 🔥 | Must address immediately |
| High | ⬆️ | Important, do soon |
| Medium | ➡️ | Normal priority |
| Low | ⬇️ | Nice to have |
Pages that don't belong to a database should have unique icons describing their specific content. Match the icon to the page's primary purpose.
| Content | Icon | Use For |
|---|---|---|
| Meeting Notes | 🗓️ | Scheduled discussions |
| Standup | 🧍 | Daily syncs |
| Retrospective | 🔍 | Review sessions |
| Workshop | 🛠️ | Collaborative work sessions |
| Interview | 🎤 | Candidate/user interviews |
| Announcement | 📢 | Team communications |
| Content | Icon | Use For |
|---|---|---|
| Decision Record | ⚖️ | ADRs, documented decisions |
| Proposal | 💡 | Ideas for consideration |
| Roadmap | 🗺️ | Future planning |
| Strategy | 🎯 | High-level direction |
| OKRs | 🎪 | Objectives and key results |
| Post-mortem | 🔬 | Incident analysis |
| Content | Icon | Use For |
|---|---|---|
| Brainstorm | 💭 | Ideation sessions |
| Sketch | ✏️ | Early designs |
| Prototype | 🧪 | Experimental work |
| Research | 🔎 | Discovery findings |
| Inspiration | ✨ | Reference collection |
| Content | Icon | Use For |
|---|---|---|
| Architecture | 🏗️ | System design |
| Diagram | 📊 | Visual documentation |
| API Docs | 🔌 | Integration reference |
| Schema | 🗃️ | Data structure |
| Changelog | 📋 | Version history |
| Troubleshooting | 🔧 | Debug guides |
| Content | Icon | Use For |
|---|---|---|
| Checklist | ✓ | Task lists |
| SOP | 📑 | Standard procedures |
| Escalation | 🚨 | Emergency contacts |
| On-Call | 📞 | Support rotation |
| Runbook | 📒 | Operational procedures |
| Audit | 🔍 | Compliance checks |
While Notion doesn't support icon colors directly, you can achieve color coding through careful emoji selection:
🔴 🟠 🟡 🔥 ⚠️ 🚨 - Alerts, blockers, urgent items
🔵 🟢 💚 🩵 - Active, healthy, stable items
⚪ ⚙️ 🔧 ⬜ - Configuration, settings, meta pages
Status Traffic Lights:
🔴 Blocked/Critical
🟡 Warning/On Hold
🟢 Active/Healthy
Progress Indicators:
⬜ Not started
🔲 In progress
✅ Complete
Quality/Health:
💚 Excellent
💛 Good
🧡 Needs attention
❤️ Critical
❌ Using 🎉 for a meeting note just because you like it
✅ Using 🗓️ consistently for all meeting notes
❌ Some projects have 🚀, others have 📁, others have no icon
✅ All projects have status-based icons (🟢, 🟡, etc.)
❌ 🔴🔥⚠️🚨 on one page (redundant urgency)
✅ 🔴 for blocked status (single clear signal)
❌ Major area dashboard with no icon
✅ Every navigational page has an appropriate icon
PARA Structure:
🏠 Home 📥 Inbox 🚀 Projects 🎯 Areas 📚 Resources 🗄️ Archives ⚙️ Meta
Resource Types:
📋 Spec 📖 Guide 📒 Playbook 🏷️ Reference 📝 Template 💡 Concept
Status:
⚪ Not Started 🟢 Active 🟡 On Hold 🔴 Blocked ✅ Complete
Priority:
🔥 Critical ⬆️ High ➡️ Medium ⬇️ Low
SECI Phases:
💬 Socialization 📝 Externalization 🔗 Combination 🎯 Internalization
references/emoji-semantics.md - Complete emoji meaning guidereferences/icon-automation.md - Automating icons via templates/formulas