Skip to content

Skill Cards

Skill Cards are a headless, system-agnostic card component for displaying skill-style data. Each card shows a label, an ability tag, a modifier value, and an optional proficiency level. No automatic modifier calculation is performed — you supply the exact values to display. All text and numeric properties support dynamic content templates for frontmatter integration and calculations.

System-Agnostic Components

System-agnostic component support is limited but will continue to improve in future releases. Join the discussion on GitHub to share feedback and ideas.

When to use Skill Cards vs. D&D 5e Skills

The D&D 5e Skills block integrates with frontmatter and automatically calculates skill modifiers from your ability scores, proficiency bonus, and any bonuses you define. Use it when you want full D&D 5e skill mechanics.

Skill Cards display whatever values you provide with no automatic calculations. They support dynamic content templates for pulling values from frontmatter and performing calculations. Use them when you want full control over what is shown, or when working outside D&D 5e.

KNO

Arcana

+4

STR

Blade

+3

INS

Bone

+1

KNO

Codex

+5

AGI

Grace

+3

FIN

Midnight

+4

PRE

Sage

+2

PRE

Splendor

+3

STR

Valor

+2

Example

This example shows Dagger Heart domains, but Skill Cards work with any TTRPG system.

yaml
```skill-cards
items:
  - label: Arcana
    ability: Knowledge
    modifier: 4
    proficiency: proficient
  - label: Blade
    ability: Strength
    modifier: 3
    proficiency: proficient
  - label: Bone
    ability: Instinct
    modifier: 1
  - label: Codex
    ability: Knowledge
    modifier: 5
    proficiency: expert
  - label: Grace
    ability: Agility
    modifier: 3
    proficiency: proficient
  - label: Midnight
    ability: Finesse
    modifier: 4
    proficiency: half
  - label: Sage
    ability: Presence
    modifier: 2
  - label: Splendor
    ability: Presence
    modifier: 3
    proficiency: proficient
  - label: Valor
    ability: Strength
    modifier: 2
```

Configuration

PropertyTypeDefaultDescription
itemsArrayRequiredList of skill card items to display

Item Object

PropertyTypeDefaultDescription
labelStringThe skill name to display
abilityStringThe associated ability (e.g. Wis, Dex, Str)
modifierNumberThe modifier value to display
proficiencyStringProficiency level: "proficient", "expert", "half", or omit for no proficiency

† Supports dynamic content templates

Dynamic Content Example

Use frontmatter values to drive skill card display. When frontmatter changes, the cards update automatically.

yaml
---
arcana_mod: 4
blade_mod: 3
codex_mod: 5
---
yaml
```skill-cards
items:
  - label: Arcana
    ability: Knowledge
    modifier: '{{ frontmatter.arcana_mod }}'
    proficiency: proficient
  - label: Blade
    ability: Strength
    modifier: '{{ frontmatter.blade_mod }}'
    proficiency: proficient
  - label: Codex
    ability: Knowledge
    modifier: '{{ frontmatter.codex_mod }}'
    proficiency: expert
```