pen.dev

Design in your codebase. AI Design Canvas that you can use with your ChatGPT and Claude subscriptions and Composer/Grok, Gemini, Kimi, GLM, Qwen, Minimax models

[pen.dev @pendev]

TABS! 💥

[Tom Krcha @tomkrcha]

Introducing Tabs in @pendev! Manage multiple files from the titlebar and easily resume work where you started. FINALLY, I know 🤓

[drew dillon @drewdil]

Told @tomkrcha weeks ago his team cooked with the latest version of @pendev and my co-founder's now shared the receipts.

How Stephan rebuilt, massively extended, and launched a brand new @usebrief website in five days using:

- @pendev
- @superset_sh
- @jamdotdev
- @claudeai
- @linear

and, of course, @usebrief.

https://t.co/H5ESjtyjNf

[pen.dev @pendev]

@reachdiego What version are you on?

[pen.dev @pendev]

This is a small one, but good one. Press 'I' to activate eyedropper color picker.

[pen.dev @pendev]

@soufycode niiice

[pen.dev @pendev]

@erdhyernando it should :) does it?

[pen.dev @pendev]

@developerBolu 🩶

[Doro @is_doro]

@pendev cooks hard 😮‍💨😮‍💨

[pen.dev @pendev]

@jeffreyblum @claudeai ooh, that looks fresh! 😮‍💨

[pen.dev @pendev]

@is_doro @figma 👌🙇🤍

[pen.dev @pendev]

@OluwafemiDsgn You can already import images by exporting .fig file and dropping it on canvas in @pendev. Fonts planned. 🫡

[pen.dev @pendev]

@joanrod_ai 😮‍💨

[pen.dev @pendev]

@adamhamrozi This is 🔥

[Tom Krcha @tomkrcha]

Vectors and shaders are an epic combo.
@QuiverAI Arrow 2 🤍 @pendev shaders

[DANN© @DannPetty]

I love me a good feature launch video.

[pen.dev @pendev]

@DannPetty 👀

[pen.dev @pendev]

Vibe Shaders! 🔥

[Tom Krcha @tomkrcha]

Today we are re-launching shaders in https://t.co/QCeiUQKHOF. We call them Vibe Shaders. There's nothing else like them. They live next to your .pen files as GLSL files and can be easily vibecoded right on the canvas. Built by designers for designers.

They deserved a special Shader Mode, a focused mode to finetune the uniforms directly in the context of your design.

In addition to the classic Shader Fills, we've also added Shader Effects. This allows for incredible creative flexibility, as it applies the effect on a whole object tree that's part of a particular frame and you can change everything live, no hustling with textures.

Additionally we are also launching Background Shaders, they sample the texture from everything below the object. Imagine creating your own custom background blur or a partial dither effect for objects below a frame.

You can also create shaders with 3D transformations to vector logos or build custom shader brushes for vectors paths.

Forget having just a fixed set of shaders, this is next level and only possible, because we have a full control over our custom renderer. We also automatically compute the SDF (signed distance field) in realtime, so vectors that have applied shaders can be changed directly on canvas without the need to re-export a new SDF file, an incredible time-saver.

Look for the samples in Goodies, which has been updated with a ton of new examples.

Or simply pair @pendev with the latest models, drop in a bunch of images, ask agent to build you a shader and it's guaranteed you will feel an explosion of your creative superpowers!

[pen.dev @pendev]

@svorklab @ot @elyxdesign you can load up @pendev in visual studio or cursor as an extension and control it via terminal. Or just use the webmcp to talk to it from your embedded terminal solution

[pen.dev @pendev]

@NguynAn12512127 @mobbin @notion @linear yes

[pen.dev @pendev]

It's now possible to connect https://t.co/STrqg9vB0X directly to an external MCP Server like @mobbin, @notion and @linear and attach them to the context. Quite powerful!