Big Idea

The argument in one line.

Pairing Claude Fable 5.1 with Claude Design's /design command turns a raw prompt into editable Instagram carousel slides, and building a reusable design system on top is what takes the output from rough to publish-ready.

Who This Is For

Read if. Skip if.

READ IF YOU ARE…

You already use Claude Code and want a repeatable way to turn a topic into branded, publish-ready Instagram carousel slides.
You run a content or design operation and want to build a reusable design system (fonts, colors, spacing) instead of accepting one-off AI output.
You want to connect an external image-generation MCP, like Higgsfield, to Claude Code for AI-rendered backgrounds.

SKIP IF…

You want a finished, no-setup tool. This is a live workflow demo with rough edges, including a 16-minute run that wandered off-task.
You're not using Claude Code's desktop app, since the /design command and MCP connector steps shown are specific to that app.

TL;DR

The full version, fast.

Claude Fable 5.1 is Anthropic's newest, most creative model, and this video pairs it with Claude Design's /design command, now available inside the Claude Code desktop app, to build Instagram carousels from a single topic. The demo runs three levels: a freeform prompt on 'how to drink milk' that produces funny but rough slides and a 16-minute detour where Fable wandered into unrelated font and directory setup; a design system built from a Pinterest reference image that locks in fonts, colors, and layout for consistent, editable output; and a final pass that swaps in AI-rendered background images through the Higgsfield MCP while keeping text and layout editable. The lesson: scope prompts tightly and save the design system as a reusable asset.

Free for members

Chat with this breakdown — free.

Sign in and you get 23 free chat messages on us — ask for the hook, quote a framework, find the exact transcript moment, generate a markdown action plan. Bring your own key when you want unlimited.

Create a free account →

Chapters

Where the time goes.

00:00 – 00:26

01 · Introduction: Fable 5.1 Carousels

Anthropic's Fable 5.1 announcement page; host frames the video as a creativity test, pairing Fable 5.1 with Claude Design to build Instagram carousels rather than covering benchmarks.

00:26 – 00:52

02 · Meet Duncan Rogoff

Host introduces himself as a former art director at Apple, PlayStation, and Nissan who now runs a Claude Code learning community, and previews a packaged carousel skill by the end.

00:52 – 01:02

03 · How to Select Fable 5.1

Claude Code desktop app usage dashboard; Fable 5.1 shown available in the model selector as Anthropic's latest and most creative model.

01:02 – 01:45

04 · How to Access Claude Design

The /design slash command, previously browser-only, is now inside the Claude Code desktop app and can build mobile apps, slide decks, UIs, animations, and carousels.

01:45 – 02:22

05 · How to Prompt Your Carousel

Sets up a scoped 'milk' working folder, types /design, and prompts: build an Instagram carousel on 'how to drink milk,' ignore existing design files, think super creatively.

02:22 – 02:44

06 · How to Set Effort Level

Reviews Fable 5.1 vs Fable 5 benchmarks and sets Claude Code's effort level to High for the best balance of performance and cost.

02:44 – 03:26

07 · How to Review Level One

First carousel finishes: a cover plus slides on locating milk, selecting a vessel, pouring, and a mustache-etiquette card, with genuinely funny AI-written copy and two alternate styles.

03:26 – 04:10

08 · Fable 5.1 Limitations to Watch

The level-one run took 16 minutes and Fable wandered into fetching Google Fonts and browsing an unrelated directory unprompted; lesson is to be more explicit in instructions.

04:10 – 04:53

09 · How to Build Design Systems

Introduces level two: a design system covering fonts, colors, spacing, textures, animation, and icons, with Pinterest used to source a visual reference.

04:53 – 05:12

10 · How to Use Reference Images

Pastes a Pinterest reference image into Claude Code and prompts it to build a design system HTML from the reference and regenerate the carousel in that style, generating only the slides.

05:12 – 05:50

11 · How to Edit Design Elements

Demonstrates that every generated element (text, weight, alignment, spacing) is manually editable through a side panel, in addition to being changeable via chat prompt.

05:50 – 06:52

12 · How to Save Design Systems

Opens the saved design-system.html file documenting the full color palette, typography, glow, and grid styles; notes Fable 5.1 self-checks by opening slides in a browser and regenerating weak ones.

06:52 – 07:46

13 · Level Three: AI Backgrounds

Introduces level three: combining Claude Design's editable layers with fully AI-rendered background images, prompting for big, full-bleed images while keeping text and design elements editable.

07:46 – 08:53

14 · How to Connect Higgsfield MCP

Walks through connecting Higgsfield, an AI image/video model marketplace including GPT Image and Nano Banana, to Claude Code as a custom MCP connector.

08:53 – 09:27

15 · How to Package Carousel Skill

Level three finishes with AI-generated photo backgrounds behind still-editable text; closes by turning the whole process into a reusable Claude skill for any future topic.

Atomic Insights

Lines worth screenshotting.

Claude Fable 5.1's /design command now works inside the Claude Code desktop app, not just the browser.
A single freeform prompt on Fable 5.1 with the effort level set to High produced a full six-slide Instagram carousel plus two alternate styles.
Left unconstrained, Fable 5.1 spent part of a 16-minute run pulling in unrelated Google Fonts and directory files it was never asked to touch.
A design system HTML file that locks in fonts, colors, spacing, and icon style is what turns one-off AI slides into a repeatable, on-brand asset.
Pasting a single Pinterest reference image into Claude Code was enough to regenerate an entire carousel in a matched visual style.
Every element Claude Design generates, from font weight to spacing to color, stays manually editable through a side panel inside Claude Code.
Fable 5.1 checks its own work by opening generated slides in a browser and regenerating any it judges weak, which costs extra time and tokens.
Connecting an external image-generation tool like Higgsfield to Claude Code happens entirely through the MCP connector menu, no code required.
A finished carousel workflow, prompt pattern, design system, and image-gen connection, can be packaged into a single reusable Claude skill for future topics.
Vague instructions invite Fable 5.1 to over-engineer the task; a scoped instruction like 'generate the slide images and nothing else' keeps it on task.

Takeaway

Three levels turn one prompt into a branded carousel system

CAROUSEL DESIGN WORKFLOW

The jump from rough AI output to publish-ready carousels comes from scoping prompts tightly, saving a reusable design system, and layering in AI-rendered imagery only once the layout is locked.

03How to Select Fable 5.1

Fable 5.1 shows up as a selectable model in Claude Code's model picker as soon as Anthropic ships it, no separate signup needed.
It's positioned as the most creative model in the lineup, which is the reason to reach for it on visual/design tasks over a more code-focused model.

04How to Access Claude Design

The /design slash command brings Claude Design, previously a browser-only tool, directly into the Claude Code desktop app.
One command covers a wide range of visual output: mobile app mockups, slide decks, UI screens, animations, and social carousels.

05How to Prompt Your Carousel

A working folder scoped to the project keeps Claude Design's output and files contained to that task.
Telling Claude to ignore any existing design-system files is necessary when you want to see its unguided creative output rather than a brand-matched one.

06How to Set Effort Level

Claude Code's effort-level setting is a direct lever on the performance-vs-cost tradeoff, and High is where the Fable 5.1 vs 5 benchmark curves suggested the best balance.
Checking the model benchmark chart before a big generation run is a cheap way to decide how hard to push the model.

07How to Review Level One

A single unguided prompt was enough for Fable 5.1 to produce a full multi-slide carousel plus two alternate visual styles to choose between.
Fable 5.1's copywriting leaned genuinely funny without being asked for humor, which is unusual for AI-written copy.

08Fable 5.1 Limitations to Watch

Left unconstrained, Fable 5.1 spent part of its 16-minute run chasing tangents, pulling in Google Fonts and unrelated directory files nobody asked for.
The fix is tighter scoping in the prompt itself, saying exactly what to generate and nothing else, instead of trusting the model to self-limit.

09How to Build Design Systems

A design system, one HTML file capturing fonts, colors, spacing, textures, and icon style, is what makes future generations consistent instead of one-off.
A reference site like Pinterest is a fast way to source a visual direction before asking Claude to formalize it into a system.

10How to Use Reference Images

A single pasted reference image plus a scoped prompt was enough to regenerate the whole carousel in a matched style.
Explicitly telling Claude to do only the requested action is the direct countermeasure to the wandering behavior seen in level one.

11How to Edit Design Elements

Every element Claude Design produces stays clickable and manually editable through a side panel, no regeneration required for small tweaks.
For changes too tedious to do by hand, the same chat interface can be used to ask Claude to make the edit directly.

12How to Save Design Systems

The design-system.html file lands in the working folder as a durable, reusable artifact, not something regenerated from scratch each time.
Fable 5.1 reviews its own output by opening finished slides in a browser and regenerating weak ones on its own, which raises quality but adds real time and token cost worth weighing.

13Level Three: AI Backgrounds

Combining Claude Design's editable text/layout layer with fully AI-rendered background images is what pushes output from a good template to genuinely beautiful.
The prompt pattern is specific: ask for big, full-bleed generated images while explicitly keeping text and other design elements editable.

14How to Connect Higgsfield MCP

Connecting an external image/video generation platform to Claude Code is a no-code process: copy the connector URL, add it as a custom connector, sign in.
Once connected, an MCP tool like Higgsfield exposes multiple underlying image/video models directly inside the same Claude Code chat.

15How to Package Carousel Skill

A full workflow, prompt pattern, saved design system, and connected image-gen tool, can be bundled into a single Claude skill so any new topic runs on the same rails.
Packaging the workflow as a skill is what turns a one-off demo into something repeatable for future content work without re-deriving the process each time.

Glossary

Terms worth knowing.

Claude Design: A Claude feature for generating and hand-editing visual layouts, such as slide decks, UIs, mobile app mockups, and carousels, that recently moved from browser-only into the Claude Code desktop app.
/design command: The slash command inside Claude Code that opens the Claude Design skill so Fable can generate an editable visual layout from a prompt.
Design system HTML: A single HTML file documenting an established set of fonts, colors, spacing, and visual elements so future AI-generated assets stay visually consistent.
Effort level: A Claude Code setting, such as High, that trades more processing time and token spend for a more thorough, higher-quality response.
MCP (Model Context Protocol): A connector standard that lets Claude Code call out to external tools and services, such as an image-generation platform, directly from a chat session.
Higgsfield: A third-party platform offering multiple AI image and video generation models, including GPT Image and Nano Banana, that can be connected to Claude Code via MCP.

Resources

Things they pointed at.

00:44linkDuncan Rogoff's Claude Code resources (Skool community) ↗

00:00toolClaude Fable 5.1

01:02toolClaude Design (/design)

04:10toolPinterest

07:46toolHiggsfield ↗

Quotables

Lines you could clip.

00:08

“Claude Fable 5.1 just dropped and it is blowing all the other models out of the water, especially when you consider its performance to the cost.”

specific, high-energy hook claim with a cost angle→ TikTok hook↗ Tweet quote

03:10

“In case of mustache, remain calm, wipe with sleeve, continue drinking.”

unexpected, self-contained joke line from AI-written product copy→ IG reel cold open↗ Tweet quote

05:41

“You can do this now right inside of Claude Code, which is absolutely insane.”

punchy reaction line that sells the editable-canvas feature in one breath→ newsletter pull-quote↗ Tweet quote

The Script

Word for word.

Read-along

Don't just watch it. Burn it in.

See every word as it's spoken — crank it to 2× and still catch all of it. The same dual-channel trick behind Amazon's Kindle + Audible.

metaphoranalogy

Claude Fable 5 .1 just dropped and it is blowing all the other models out of the water, especially when you consider its performance to the cost. But we're not here to talk about the benchmarks today. We're gonna put Fable 5 .1's creativity to the test.

by pairing it with cloud design to create some beautiful Instagram carousels. I'm going to show you three levels of cloud design to take you from basic to beautiful so you can stay ahead of everyone else. And if we haven't met yet, my name is Duncan Rogoff.

I'm a former art director at brands like Apple, PlayStation, and Nissan, and I now run one of the top communities for learning cloud code and building income. And at the end of this video, I'm even going to show you how to package up our entire carousel design system into a single skill so you can build beautiful branded carousel.

sales on autopilot. So focus in, close all your open tabs, and let's build. If you want to get access to anything we build today, just check the link in the description.

So if you come into Cloud Code in the desktop app, you can come down to the model selector here, and you can see we already have access to Fable 5 .1, which is Anthropic's latest and greatest model. It is the most creative model on the planet. So I wanted to pair this with another new feature inside of the desktop app, which is the slash design command.

This gives you access to building all sorts of beautiful designs directly inside of Cloud Code. Up until recently, cloud design only existed in the browser. You can build mobile apps, you can build slide decks, you can build UIs, animations, you name it, you can build it, and we can most certainly build Instagram carousels.

But what's cool is now this functionality has come to the desktop app by way of this slash design command. So I want to test Fable 5 .1's creativity, so we're going to build an Instagram carousel on everyone's favorite topic. milk.

So inside of the desktop app, you want to make sure that you just have cloud code selected up here and you want to make sure that you're inside of a folder that you want to work in on your computer. So I'm just going to click the desktop and I'm going to say milk. So all we have to do to get started is we want to type in slash design to bring up the design skill.

And now we can just tell Fable 5 .1 exactly what it is that we want to make. So I'm going to use a very simple prompt. I said, build an Instagram carousel on the topic, how to drink milk.

And then I just told it to ignore any of my existing design rules or files, because if you're someone who's been building with Claude, you probably have a design system in place. I'm going to show you how to build that a little bit later on. for now i just wanted to ignore it to see how creative fable gets so we can say think super creatively about this so if we do want to take a look at the benchmarks really quick this top line is fable 5 .1 and this bottom line is fable 5 and it seems like if we were to set this on high we maybe get the best balance of performance to cost so inside of cloud code you can just come into the level of effort down here and we can just crank this up to high to see if we can get some creative results okay so this finished and since we're testing this live let's just talk about the good and the bad of fable 5 .1 so it did make all of these instagram carousel slides And honestly, if we zoom in, one of the things that I notice is that it's actually pretty funny.

And AI typically is not very funny. And so how to drink milk. Please review this card before drinking.

even if you have done this before. So locate the milk, select a vessel, pour, assume the position, drink. And then I like this in case of mustache, remain calm, wipe with sleeve, continue drinking.

So I thought this was pretty funny. And then one of the other things with cloud design is that it creates two alternate styles for you to choose from if you want to pick that. And now these designs graphically, visually are maybe not the most appealing.

I actually think this is pretty funny and like pretty solid up top here. And I kind of like this one. But one of these issues.

that I ran into is that this ran for 16 minutes to get to this point. And all of a sudden it started looking for like Google fonts and like a Barlow agent and pulled up this directory and did a whole bunch of stuff that I like didn't ask it to do. It was almost thinking like too creatively about the process and was kind of just trying to do too much in general.

So that's definitely one thing I think you're going to want to watch out for with Fable 5 .1. I imagine it's going to get better over time, but really make sure that you are explicit. with your instructions.

Like it turns out, I probably should have said like generate the slide images and nothing else. So this is pretty good, but we can take it one step further, which brings me to level two, which is creating a design system. Now, this is an old design system that I created just to give you an example.

Basically, a design system covers all of the fonts, all of the colors, all of the spacing, the textures, the animation, the icons that you're going to use, anything that you are going to need to make a brand or bring a brand to life or create. assets on repeat so if you want to create carousels or a website or animations they're all going to fit into this same style for consistency one of the best ways to do that is to find references so you can just go on a site like pinterest you can search for social media posts and you can find something that interests you I liked this top one here.

I think this one is cool and something that we can try to mimic. And so what you can do, it's really easy, is you can just copy an image like this. You can come back into quad.

You can paste that in. And so you can give it a prompt like this. Create a design system HTML based on the attached reference and then regenerate the Instagram carousel in this style.

And then I added only generate the slides. Don't do anything else. And so the other thing I forgot to mention about why cloud design is so powerful is that because everything is editable.

You can go in, you can resize things, you can edit the font for whatever you want. You can bring up this side panel and you can click on any of these elements. You can edit the weight you can edit the alignment the spacing any of these things so if you want to do anything manually you can do this now right inside of cloud code which is absolutely insane and then if there's anything you want to change about your designs that you don't want to do manually obviously you can come back into the little chat box and tell claude what you want to change so round two just finished and these are already looking much better and much more in line with our new design system so we can see we have this kind of glowing orange these nice big graphics.

Everything is looking really crisp and clear and branded. And I'm really happy about this. And what's cool is that if we come into the folder we're working in, you can see we have this design system HTML.

And if we open this up, we can see our entire color palette. We can see all of the typography, how we do our highlights, our CTA pills, how we do this glow, the grid and the background elements and all of this stuff. So now we have a repeatable system that we can use for any assets moving forward.

One thing I did notice about Fable 5 .1 is that during this process, Fable really insists on checking its own work. So it actually opened up all of these slides in a separate browser it went through and it checked all of them and actually regenerated some of the images that it thought could be better. So of course, this takes extra time and extra tokens and sort of this push and pull between how good you want Fable to be and how much time and tokens you're willing to spend.

While I do think these look really good, I think we can make these even more beautiful, which brings me to level three. 3 is a combination of quad design, which allows you to have these editable layers and fully rendered AI generated images. So what I want to do is I want to replace all of these background images with something that looks a whole lot more beautiful, but keep the text and all of the design assets editable inside of quad code and quad design.

So I just said, use Higgs field to generate the background images for our carousels and our reference style. Big, beautiful, full bleed images keep our text and other elements editable. So in order to do this, we're going to plug into a site called Higgs field, which gives you access to all of the latest image and video models.

Things like GPT image two or nano banana is what we're going to be using today. So it's super easy to connect Higgs field to quad code. All you have to do is come up to the MCP and CLI.

You can see we already have quad selected. Just copy this link to the MCP right here. Inside of quad code, you're going to click the plus, come into connectors, go into manage connectors, click add, add custom connector.

You can name this Higgs field. paste in the url and click continue it's then going to ask you to sign in with your name and password and once you've done that you basically have access to all the image and video generation models from higgs field directly inside of quad code and this becomes extremely powerful so level 3 finish and these are super fun it automatically creates this combination of generated images and design elements inside of cloud code and cloud design and of course if you want to edit anything right you can still come in and like edit any of the text or move things around or delete elements if you want them, right?

So I really like these. I think these are really fun, especially this mustache one. I think these are great and sort of intuitively new to generate an image with a shadow on this top half and only leave space for the image on the bottom.

So now that we have all of this, we can turn this into a repeatable skill where we can give Fable 5 .1 any topic and it can generate these beautiful carousels for us on autopilot. So I just said, I want to turn this process into a new carousel skill. Give Cloud a topic.

It generates beautifully designed carousels with a mix of AI images and Cloud design editable elements. If you want to get access to that skill, along with all my other resources, just check the link in the description. If you want to see how I use Cloud design to build beautiful websites, just check out this video right here.

I'll see you over there.

The Hook

The bait, then the rug-pull.

Claude Fable 5.1 just shipped, and instead of running benchmarks, Duncan Rogoff points it at Claude Design to see how far its creativity actually goes: building an Instagram carousel on a throwaway topic, milk, in three escalating passes.

Frameworks