Textual Screenshot logo

Textual Screenshot

OrganizationPopular
langchain-ai
textual-screenshot

Capture a Textual terminal UI as an SVG using its headless test harness. Use when asked to make, attach, or preview a screenshot of deepagents-code/dcode or another Textual app, visually verify a TUI state, or render a modal, screen, or widget without a desktop or browser.

Overview

Publisherlangchain-ai
Repositorydeepagents
Skill nametextual-screenshot
Stars
29.9K
Forks
4.2K
Bundled files
Instructions only
LicenseMIT
Links
  • Markdown instructions

    A SKILL.md file the model loads on demand, so it only costs tokens when a request actually matches.

  • Works with any LLM

    AI skills are plain Markdown, not provider-specific code, so this works with GPT, Claude, Gemini, Grok, or a local model.

  • Self-contained

    Everything the model needs lives in the instructions — no extra files to sync.

  • Open source

    Published by langchain-ai on GitHub. Read the source before you install it.

Installation

Install the Textual Screenshot AI skill in TypingMind to use it with any LLM, or drop it into another agent that reads SKILL.md.

1

Install in TypingMind

TypingMind installs a skill straight from its GitHub folder — it reads SKILL.md, bundles the resource files, and stores the result locally.

  1. Open the app and go to Plugins → Skills.
  2. Choose "Install from GitHub".
  3. Paste the skill folder URL below and confirm.
    https://github.com/langchain-ai/deepagents/tree/main/.agents/skills/textual-screenshot
  4. Enable the skill in any chat where you want it available.
Plugins → Skills → Add skill → From GitHub URL, then paste the folder URL and press Continue.
2

Install in another agent

Any agent that reads the Agent Skills format can use this skill — copy the folder into that agent's skills directory.

Claude Code — .claude/skills
git clone --depth 1 https://github.com/langchain-ai/deepagents.git /tmp/deepagents
mkdir -p .claude/skills
cp -r /tmp/deepagents/.agents/skills/textual-screenshot .claude/skills/textual-screenshot
Restart Claude Code after copying so it picks up the new skill.

Use it in TypingMind

Enable Textual Screenshot in any TypingMind chat and the model takes it from there. Its name and description sit in the system prompt, and the moment a request matches, the model loads the full instructions itself — you never invoke it by hand, and it costs no tokens until it is actually used.

The model loads Textual Screenshot on its own as soon as a request matches it.

Works with any AI model

AI skills are plain Markdown instructions rather than provider-specific code, so Textual Screenshot is not tied to the model it was written for. Install it once in TypingMind and use it with GPT-5, Claude, Gemini, Grok, DeepSeek, Mistral, Llama, or a local model you run yourself — all on your own API keys.

  • Loaded only when it is needed

    The system prompt carries just the name and description. The instructions are fetched on the first matching request, so an idle skill costs nothing.

  • Switch models mid-chat

    Because the skill is instructions rather than code, changing model does not break it — the next model reads the same SKILL.md.

Skill instructions

This is the SKILL.md content the model loads. Read it before installing — a skill is instructions your model will follow.

Textual Screenshot

Render the real app with Textual's headless test harness, drive it to the requested state, and save the composed terminal as SVG. Prefer this over browser automation or OS-level screenshot tools.

Capture workflow

  1. Identify the App class and the shortest trusted local setup that reaches the requested UI.
  2. Write a temporary Python script outside the repository. Keep generated screenshots outside the repository unless the user explicitly requests a committed artifact.
  3. Start the app with a deterministic terminal size using app.run_test(size=(columns, rows)).
  4. Call await pilot.pause() after startup and after every action that changes visible state. Use pilot.press(...) for a realistic interaction path when practical; direct app methods are acceptable for a focused preview.
  5. Call app.save_screenshot(output_path) while the desired state is visible. Use an .svg path.
  6. Inspect the resulting SVG and confirm its file size is reasonable before sharing it.
  7. Delete temporary scripts and captures when they are no longer needed.

Minimal deepagents-code example:

python
import asyncio
import os
from pathlib import Path
from tempfile import TemporaryDirectory
from unittest.mock import AsyncMock, MagicMock, patch


async def main() -> None:
    output = Path("/tmp/dcode-ui.svg")
    with TemporaryDirectory() as profile:
        os.environ["DEEPAGENTS_HOME"] = profile
        from deepagents_code.app import DeepAgentsApp

        app = DeepAgentsApp(agent=MagicMock())
        with patch.object(app, "_post_paint_init", new=AsyncMock()):
            async with app.run_test(size=(110, 36)) as pilot:
                await pilot.pause()
                await app._handle_command("/model")
                await pilot.pause()
                app.save_screenshot(output)
    print(output)


asyncio.run(main())

Run from libs/code so the project environment and editable package resolve:

bash
uv run python /tmp/capture_dcode_ui.py

Adapt only the app constructor and action that opens the target state. For a standalone Textual app, import its App subclass and use the same run_test/save_screenshot sequence.

Reliability and safety

  • Use trusted local application code only. A headless app can still run startup hooks, subprocesses, or network calls. For DeepAgentsApp, set DEEPAGENTS_HOME to a temporary directory before importing deepagents_code, and mock _post_paint_init before mounting; replacing only the agent does not isolate startup side effects.
  • Never capture secrets, credentials, private conversation content, or unrelated user data. Seed only synthetic content needed for the preview.
  • Choose a bounded terminal size; start with (110, 36) and adjust only when the target clips or wastes substantial space.
  • Wait for workers, animations, and modal transitions to settle. Add another await pilot.pause() rather than using arbitrary sleeps.
  • Do not treat a generated SVG as proof that interaction works. Use normal Textual tests for behavior and the screenshot for visual inspection.
  • Do not hand-edit the SVG. Reproduce the intended app state and recapture it.

Frequently asked questions

What does the Textual Screenshot AI skill do?

Capture a Textual terminal UI as an SVG using its headless test harness. Use when asked to make, attach, or preview a screenshot of deepagents-code/dcode or another Textual app, visually verify a TUI state, or render a modal, screen, or widget without a desktop or browser.

Why use Textual Screenshot on TypingMind?

Because you install it once and use it with any model. Textual Screenshot is plain Markdown rather than provider-specific code, so the same skill runs on GPT-5, Claude, Gemini, Grok, or a local model — and you can switch model mid-chat without it breaking. TypingMind runs on your own API keys, so you pay providers directly instead of a per-seat subscription, and your skills and chats stay in your own storage.

How do I install Textual Screenshot in TypingMind?

Open Plugins → Skills → Install from GitHub in TypingMind and paste https://github.com/langchain-ai/deepagents/tree/main/.agents/skills/textual-screenshot. TypingMind reads its SKILL.md and installs it as a skill you can enable per chat.

Which AI models can use Textual Screenshot?

Any model you connect in TypingMind. AI skills are plain Markdown instructions rather than provider-specific code, so GPT, Claude, Gemini, Grok, and local models can all load this skill when a request matches it.

How many AI models can I use with Textual Screenshot?

As many as you like. As long as a model supports skills, you can use Textual Screenshot with it — GPT, Claude, Gemini, Grok, DeepSeek, Mistral, Llama and more — all on TypingMind with your own API keys.

Is the Textual Screenshot AI skill free?

Yes. It is published on GitHub by langchain-ai under the MIT license. You only pay your own AI provider for the tokens you use.

What are AI skills?

An AI skill is a reusable instruction bundle that teaches an AI model how to do one specific task. It follows the open Agent Skills format: a SKILL.md file with a name and description, plus any scripts, templates or reference files the model may need. The model reads the instructions only when your request matches the skill, so an installed skill costs nothing until it is used.

How are AI skills different from plugins or MCP servers?

A plugin or MCP server gives a model new tools to call — code that runs somewhere and returns a result. An AI skill gives the model knowledge and process instead: how to approach a task, which steps to follow, what good output looks like. Skills are plain Markdown, so they need no server, no API key and no runtime, and they work with any model.

View all

Set up your own AI workspace now

Get notified about new features and future giveaways by subscribing to our newsletter 👇