Agent Skills: Lucidchart — Document & Shape Creation

Lucidchart — Document & Shape Creation

Overview

Primary workflow for Lucidchart integration.

Instructions

Step 1: Create a Document

const doc = await client.documents.create({
  title: 'API Architecture Diagram',
  product: 'lucidchart'  // or 'lucidspark'
});
console.log(`Document: ${doc.documentId}`);
console.log(`Edit URL: ${doc.editUrl}`);

Step 2: Add Shapes via Standard Import

// Lucid Standard Import uses .lucid file format
const importData = {
  pages: [{
    id: 'page1',
    title: 'Main',
    shapes: [
      { id: 's1', type: 'rectangle', boundingBox: { x: 100, y: 100, w: 200, h: 80 },
        text: 'API Gateway', style: { fill: '#4A90D9' } },
      { id: 's2', type: 'rectangle', boundingBox: { x: 100, y: 300, w: 200, h: 80 },
        text: 'Database', style: { fill: '#7B68EE' } }
    ],
    lines: [
      { id: 'l1', endpoint1: { shapeId: 's1' }, endpoint2: { shapeId: 's2' },
        stroke: { color: '#333', width: 2 } }
    ]
  }]
};
await client.documents.import(doc.documentId, importData);

Step 3: Export Document

const png = await client.documents.export(doc.documentId, {
  format: 'png', pageIndex: 0, scale: 2
});
fs.writeFileSync('diagram.png', png);

Resources

• Lucidchart Docs

Next Steps

See lucidchart-core-workflow-b.