segmently-cli-figma-webembed-import

Extract Figma frames into WebEmbed screen artifacts for Segmently CLI imports.

Updated Jun 29, 2026
One-click install
npx skills add https://github.com/segmently-ai/segmently-support-plugins --skill segmently-cli-figma-webembed-import
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: segmently-cli-figma-webembed-import
Source: https://github.com/segmently-ai/segmently-support-plugins/tree/main/plugins/segmently-launch-assistant/skills/segmently-cli-figma-webembed-import
Command: npx skills add https://github.com/segmently-ai/segmently-support-plugins --skill segmently-cli-figma-webembed-import

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, sharp, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill turns Figma screens into CLI-ready WebEmbed artifacts so support teams can convert complex designs without hand-building each screen.

Core Features & Use Cases

  • Extracts Figma frames into per-screen work items and catalog files.
  • Converts layout context into standalone HTML, interaction maps, and data-source plans.
  • Handles onboarding screens, media-heavy layouts, footer CTAs, header actions, and paywall classification.
  • Uses pilot gating, project-profile rules, and media CDN stabilization to reduce conversion errors before handoff.

Quick Start

Use the segmently-cli-figma-webembed-import skill to convert the selected Figma frame into WebEmbed artifacts and hand it off for CLI-ready materialization.

Frequently Asked Questions about segmently-cli-figma-webembed-import

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

FAQPage Schema
How do I convert Figma frames into HTML for CLI imports?

To convert Figma frames into HTML for CLI imports, this skill extracts selected screens into portable WebEmbed artifacts, generating standalone HTML, interaction maps, and data-source plans for onboarding and paywall layouts.

What are WebEmbed artifacts and when do I need them for Figma handoff?

WebEmbed artifacts are portable screen extractions from Figma used when converting designs into CLI-ready work items. You need them to materialize onboarding, paywall, and support screens into HTML and handoff catalogs without hand-building each layout.

Do I need Playwright and Sharp to extract Figma frames into WebEmbed artifacts?

Yes, Playwright and Sharp are required dependencies for extracting Figma frames into WebEmbed artifacts. Playwright handles screen interaction and discovery, while Sharp manages media CDN stabilization for heavy layouts during the conversion process.

Can I use this to materialize paywall and onboarding screens from Figma?

Yes, you can use this skill to materialize paywall and onboarding screens from Figma. It specifically handles paywall classification, header actions, footer CTAs, and media-heavy layouts, converting them into per-screen work items and catalog files.

What's the best way to validate Figma layout sources before CLI apply?

The best way to validate Figma layout sources before CLI apply is using pilot-gated conversion with project-profile enforcement. This skill performs complete layout-source validation and data-source materialization to reduce conversion errors prior to handoff.

Why does Figma to WebEmbed conversion require pilot gating and project profiles?

Figma to WebEmbed conversion requires pilot gating and project profiles to enforce media CDN stabilization and reduce layout conversion errors. These constraints ensure data-source materialization and layout-source validation pass before applying changes via the CLI.