write-example

Name: write-example
Availability: InStock
Author: novaai-innovation

Generate tldraw SDK examples with React and TypeScript structure.

Updated Jan 29, 2026

Search Tags:#documentation #react #code generation #sdk #examples #tldraw

Ready to run

npx skills add https://github.com/NovaAI-innovation/Infinite-Agency --skill write-example-novaai-innovation

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: write-example
Source: https://github.com/NovaAI-innovation/Infinite-Agency/tree/main/.qwen/skills/write-example
Command: npx skills add https://github.com/NovaAI-innovation/Infinite-Agency --skill write-example-novaai-innovation

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the process of creating and documenting new examples for the tldraw SDK, ensuring consistency and discoverability.

Core Features & Use Cases

Example Structure Guidance: Provides clear standards for organizing example code, READMEs, and assets.
Frontmatter Standardization: Ensures all necessary metadata (title, component, category, priority, keywords) is included for each example.
Code Snippet Examples: Demonstrates best practices for React component structure, styling, and UI control panel integration.
Use Case: A developer needs to add a new demonstration of a custom shape tool to the tldraw examples app. This Skill guides them through creating the necessary files and frontmatter.

Quick Start

Use the write-example skill to create a new tldraw SDK example for a custom canvas feature.

Frequently Asked Questions about write-example

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create examples for the tldraw SDK?▼

Creating tldraw SDK examples involves generating React and TypeScript code that adheres to specific structural standards. You must include frontmatter metadata like title, category, and keywords to ensure proper documentation and discoverability within the examples app.

What metadata is required for a tldraw SDK example?▼

Required frontmatter metadata for a tldraw SDK example includes title, component, category, priority, and keywords. Standardizing these fields ensures the generated code snippet is properly organized and discoverable within the tldraw examples application.

Does the tldraw SDK example generator support TypeScript and React best practices?▼

Yes, generating tldraw SDK examples requires adherence to React and TypeScript best practices. The process provides specific guidance on structuring components, applying styling, and integrating UI control panels within your generated code snippets.

What is the difference between tight and use-case examples in tldraw?▼

Tight and use-case examples are two distinct types of tldraw SDK demonstrations you can create. The example generation process facilitates building both types, ensuring each includes clear documentation, proper frontmatter, and structured React code components.

How do I add a custom shape tool to the tldraw examples app?▼

To add a custom shape tool to the tldraw examples app, you generate the necessary files and frontmatter following established structural standards. This involves creating React components, README documentation, and required assets that demonstrate the custom canvas feature.