🎴 DESIGN · Visuals & 3D Level: Beginner ⏱ 10 MIN Freemium

Generate Minimalist HTML/SVG Swipe Cards for High-Save Xiaohongshu & Instagram Carousels

Skip manual typesetting in Canva. Have Claude Artifacts render 3:4 Apple Notes or editorial-style HTML/SVG cards in a grid for instant carousel export.

CORE TOOLS Claude Artifacts / DeepSeek, Browser DevTools Screenshot

BEST FOR Xiaohongshu creators, indie hackers, newsletter authors, marketers

REQUIREMENTS Any LLM (Claude Artifacts or DeepSeek); Chrome/Edge browser

✦ WHY THIS WORKFLOW

Clean, structured cheat-sheet carousels drive the highest save rates on social platforms. HTML/CSS templates guarantee pixel-perfect alignment and 10-second reuse.

✦ Interactive Workflow Animation Preview

Step-by-Step Action Checklist

0 / 4 Completed

✓ Step 1 [Split into 6 carousel slides]: Have AI condense your article into 1 hook cover, 4 insight cards with highlighted takeaways, and 1 summary checklist.
✓ Step 2 [Render 3:4 HTML cards]: Ask AI to output a single HTML file displaying six `360x480px` cards with warm paper texture, clean typography, and page numbers.
✓ Step 3 [Add SVG highlights]: Include inline SVG marker underlines and minimalist icons next to key metrics.
✓ Step 4 [Export 3x PNGs]: Use Chrome DevTools `Capture node screenshot` at 3x DPR to save crisp, upload-ready carousel images.

READY-TO-USE PROMPT TEMPLATE

Open Official Tool / Repo ↗

Turn the content below into a **6-slide 3:4 carousel card set** as a single self-contained HTML file:
1) Fixed card dimensions `360px × 480px`, warm editorial background (`#FAF8F5`), charcoal text (`#1E1E1E`);
2) Slide 1: Bold cover with pill badge and high-contrast hook;
3) Slides 2-5: Structured insights with soft marker highlight effects and step badges;
4) Consistent footer with `01/06` pagination.
[Content]:

Use Cases & Tags:

Xiaohongshu knowledge swipe cardsApple Notes quote postersBook summary carouselsCheat-sheet slide decks#claude artifacts

Related AI Workflows

← Describe your idea on Home

DESIGN · Visuals & 3D

20 MIN

SolidCraft: Pure Rust Parametric 3D CAD with WebGPU & Autonomous MCP Agent Modeling

A breakthrough open-source parametric CAD system written in pure Rust with 10k+ GitHub stars! SolidCraft challenges bulky, subscription-heavy proprietary CAD suites like SolidWorks and Fusion 360. Powered by WebGPU, it runs blazingly fast in the browser and on desktop, featuring constraint-based 2D sketchers, parametric feature trees, extrusions, and assemblies. With built-in MCP integration, AI coding agents can translate engineering specifications directly into watertight 3D models ready for STEP, STL, and 3D printing export.

SolidCraft (Open Source)RustWebGPUModel Context Protocol (MCP)

Best for: Makers, 3D printing enthusiasts, hardware design engineers, mechanical engineering educators, robotics developers

Full guide ↗

DESIGN · Visuals & 3D

15 MIN

Generate Native Commercial PowerPoint Decks with Shapes, Transitions & Narration via Open-Source PPT-Master

An incredible breakout presentation generator with 67k+ stars on GitHub! PPT-Master abandons rigid image-based slides in favor of 100% native editable PowerPoint (.pptx) structures. It intelligently formats native vector shapes, dynamic transitions, data-driven charts, and custom enterprise branding templates—complete with AI-synthesized speaker narration tracks directly from presenter notes.

PPT-Master (Open Source)python-pptxEdge-TTS / OpenAI TTSDeepSeek / Claude

Best for: Management consultants, enterprise pre-sales architects, investment bankers, university professors, startup founders

Full guide ↗

DESIGN · Visuals & 3D

15 MIN

Craft Seamless Continuous One-Take Motion Product Launch Films & Dynamic Demos with OneTake

End choppy slide-based presentations! OneTake is an open-source motion graphics engine for continuous-camera product launch films and feature demos. Every visual beat seamlessly morphs out of the previous frame across an uninterrupted camera trajectory. Driven by coding agents with automated continuity verifiers, it delivers Apple-keynote-tier product films with pixel-perfect easing.

OneTake (Open Source)Python / TypeScriptRemotion / WebGLCoding Agent

Best for: Indie makers, product managers, brand marketing leads, UI/UX motion designers, tech YouTubers

Full guide ↗

DESIGN · Visuals & 3D

20 MIN

Video Object Rotoscoping, Tracking & Inpainting via Meta Open-Source SAM 2 & ComfyUI

End the nightmare of manual frame-by-frame rotoscoping! Meta's open-source Segment Anything Model 2 (SAM 2) brings zero-shot mask segmentation to continuous video. Click any moving object in frame 0—an actor, a jacket, a vehicle—and SAM 2 tracks it across hundreds of frames through occlusions. Integrated with ComfyUI, creators can achieve automated video inpainting, wardrobe swaps, and dynamic background replacement.

SAM 2 (Meta Open Source)ComfyUIPyTorchOpenCV

Best for: VFX artists, video editors, fashion e-commerce designers, commercial directors, virtual production creators

Full guide ↗

DESIGN · Visuals & 3D

10 MIN

Create Hand-Drawn Whiteboard Architecture & Explainer Diagrams with Open-Source Excalidraw + AI

Ditch stiff corporate flowcharts. Combine AI-generated Mermaid syntax with open-source Excalidraw to produce charming hand-drawn whiteboard diagrams in seconds.

Excalidraw (Open Source)DeepSeek / Claude

Best for: Tech bloggers, educational YouTubers, PMs, instructors

Full guide ↗

DESIGN · Visuals & 3D

15 MIN

Control Blender with Natural Language via Open-Source Blender-MCP & Claude

Intimidated by Blender shortcuts and shader nodes? Connect Claude Desktop or Cursor to Blender via open-source `blender-mcp` so AI can inspect your viewport, build 3D scenes, apply Poly Haven PBR textures and set up studio lighting.

Blender (Open Source)blender-mcp (Open Source)Claude Desktop / Cursor

Best for: 3D beginners, indie game developers, product visualizers, creative coders

Full guide ↗