正在加载视频...

视频加载失败

I asked Claude Fable 5.1 to paint the Mona Lisa with JavaScript.

105,900 次观看 • 2 个月前 •via X (Twitter)

50 条评论

Kevin Ngo 的头像
Kevin Ngo2 个月前

How this was made: 1) Start with a photo of the actual Mona Lisa, so Claude and the JavaScript program have something to look at while painting. 2) Claude wrote a JavaScript program to paint. The program continuously compares the painting with the photo to decide where the next strokes are needed. 3) Each paint stroke is drawn by a custom paintbrush that Claude coded. 4) Claude used its vision capabilities as a critic. After every change, it rendered the painting into an image and looked at it. It did things like zooming in on the face and comparing it with the same part of the actual photo, then revised the code.

Jonny Jelinek 🔥 的头像
Jonny Jelinek 🔥2 个月前

No fing way!! That's such a fascinating idea and result! 👏👏👏 This might just be the first "stroke by stroke" explanation of how the greatest art pieces where created (more or less, I guess. 😉) Could definitely be a cool course idea for art students.

Kevin Ngo 的头像
Kevin Ngo2 个月前

Actually, I originally asked Fable to paint it stroke by stroke, the way Leonardo da Vinci would have painted it. Here's that version.

Max Liebscher 的头像
Max Liebscher2 个月前

@JonnyJelinek You're new profile image is ready!

Jonny Jelinek 🔥 的头像
Jonny Jelinek 🔥2 个月前

@kevin_t_ngo Took the liberty to upscale and change it a bit - now THAT could really be my new profile pic. 😄

Max Liebscher 的头像
Max Liebscher2 个月前

@kevin_t_ngo very cuty

Jonny Jelinek 🔥 的头像
Jonny Jelinek 🔥2 个月前

@kevin_t_ngo Ja, näh?! 😜

witong 的头像
witong2 个月前

Damn actually ? that technique would be nice for a scrollytelling site

Kevin Ngo 的头像
Kevin Ngo2 个月前

Yeah if I don’t run out of usage before the weekend 🥲

witong 的头像
witong2 个月前

5.1 is as good as hungry in usage

AshutoshShrivastava 的头像
AshutoshShrivastava2 个月前

Next level 🔥

Kevin Ngo 的头像
Kevin Ngo2 个月前

Ty 🙏

lil room 的头像
lil room2 个月前

If Leonardo da Vinci and Vincent van Gogh had a child

Travis Fischer 的头像
Travis Fischer2 个月前

ooooh maybe parts of my code are in the training data for this :)

steve 的头像
steve2 个月前

And people are still like “when agi?”

Anshu 的头像
Anshu2 个月前

Amazing! Is it using a reference image, or doing it from memory?

Kevin Ngo 的头像
Kevin Ngo2 个月前

Yeah, it looks at a reference image but every one of the ~15,000 strokes is planned and painted by code

Anshu 的头像
Anshu2 个月前

Very cool!

Lianghao Chen 的头像
Lianghao Chen2 个月前

How about svg?

Kevin Ngo 的头像
Kevin Ngo2 个月前

I’m trying to conserve Fable usage, maybe next week 🥲

Light 的头像
Light2 个月前

Has anyone tried hooking Claude up to one of those one-armed robots with some brushes and colors?

Chaitanya 的头像
Chaitanya2 个月前

That goes to say nobody could paint monalisa better than vinci

shashwa7 的头像
shashwa72 个月前

woh!

Kevin Ngo 的头像
Kevin Ngo2 个月前

woah Fable 5.1 is a pretty good javascript painter

Krax 的头像
Krax2 个月前

Would love to see your setup here! What are you using for the brushes?

Kevin Ngo 的头像
Kevin Ngo2 个月前

It’s plain JS on 2D canvas. No libraries. The JS code builds the brush strokes in many layers to make it look like a real brush stroke

Krax 的头像
Krax2 个月前

So you're letting the agent draw using a tool that takes coordinates, a color & stroke width as input? And then you render it as a specific "texture stroke"? But you must have given the agents specific tools & strategies encoded in prompts/tools on top of that I assume?

Kevin Ngo 的头像
Kevin Ngo2 个月前

Claude wrote a JS program that paints. It kept looking at output renders and revised its code over a few hours, until the painting looked right

Krax 的头像
Krax2 个月前

I'd be very curious to know how it evaluated the results between each “look.” Did it write some kind of evaluation function; for example, one that compares histogram values? I’m asking because, in my setups, I’ve simply relied on the model’s vision capabilities, but I haven’t achieved results anywhere near as good as what you’re seeing here! :)

Kevin Ngo 的头像
Kevin Ngo2 个月前

Both. It looked at output renders (vision capabilities) and compared them to an image of the Mona Lisa. It also wrote a scoring algorithm/function. Hope this helps with your side quest a bit :)

dreamlikedawar 的头像
dreamlikedawar2 个月前

showing this to leo now

Adam Holter 的头像
Adam Holter2 个月前

I'm assuming it just did some kind of genetic algorithm thing. It didn't, like, manually generate the brush strokes.

Eusovimpelos Comentarios 的头像
Eusovimpelos Comentarios2 个月前

Receba

Alex Donkers 的头像
Alex Donkers2 个月前

Why? The Mona Lisa was already painted centuries ago.

timdam 的头像
timdam2 个月前

leaving this comment here so I get notified by the community notice in case

Varik Verilion 的头像
Varik Verilion2 个月前

These image-via-code demos read as sketches because the model writes shapes blind, never seeing the canvas it's drawing on.

Donna Dawn Laloux 的头像
Donna Dawn Laloux2 个月前

What an incredible idea!

Goblin Orchestrator 的头像
Goblin Orchestrator2 个月前

Is that how diffusion works?

Dustin Davis 的头像
Dustin Davis2 个月前

Now do Astra

TheGoldenAnchor 的头像
TheGoldenAnchor2 个月前

Reminds me of the time I asked @grok about the nature of consciousness:

Neatprompts 的头像
Neatprompts2 个月前

let's ask to complete the painting, i heard da Vinci didn't complete it

Pakerbeth 的头像
Pakerbeth2 个月前

Nice, but not quite there yet.

absofinlute 的头像
absofinlute2 个月前

What the FUCK!??

来财 的头像
来财2 个月前

傻逼玩意,还我血汗钱,曹尼玛的

vikas 的头像
vikas2 个月前

it's like watching the mona lisa getting painted

Eric - Not doing 9 to 5 的头像
Eric - Not doing 9 to 52 个月前

Sorry, but actually it created an image of the painting. Just so people know…it didn’t actually paint the real Mona Lisa since it was already painted many years ago. AI isn’t capable of doing things like that…yet?

AI Mastery Guide 的头像
AI Mastery Guide2 个月前

javascript mona lisa is unreal

Gustav ❖ 的头像
Gustav ❖2 个月前

Wow

aarav gupta 的头像
aarav gupta2 个月前

it’s like watching mona lisa being painted

Tanuj Prakash 的头像
Tanuj Prakash2 个月前

Now post another with GPT Astra and you've winning content for 2 posts.

相关视频