Pencil Actions

Visual design diffs in GitHub PRs. Before/after screenshots for every .pen design change.

Code review, but for designs.

Features

• 🔍 Diff mode — Only renders changed frames with before/after comparison
• 📸 Full mode — Renders every frame in changed files
• 💬 PR comments — Automatically posts/updates design previews
• 📦 Artifacts — Optionally uploads screenshots as workflow artifacts
• 🆓 Free forever — 1,000 screenshots/month, no API key needed

Quick Start

name: Design Review
on:
  pull_request:
    paths: ['**/*.pen']

permissions:
  contents: read
  pull-requests: write
  id-token: write

jobs:
  review:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: remotestate/pencil-actions@v1
        with:
          github-token: ${{ secrets.GITHUB_TOKEN }}

Links

• Product Page
• Marketplace
• Documentation
• Pencil — The design tool