正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

Design ∞ code loop, but 10x better. Introducing the browser agent in pen.dev. Import HTML/React to fully editable canvas, make edits/variations, export back to code. Build with the browser & the canvas at the same time, the ultimate combo. Download today.

Tom Krcha

21,375 subscribers

97,806 次观看 • 5 天前 •via X (Twitter)

艺术科学技术教育

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

been making a design tool where you and AI agents design together... claude code, cursor, or any cli agent can join the canvas and build with u infinite canvas, real components, everything in tailwind + html so you can just copy the code + eventually publish like any other site too

been making a design tool where you and AI agents design together... claude code, cursor, or any cli agent can join the canvas and build with u infinite canvas, real components, everything in tailwind + html so you can just copy the code + eventually publish like any other site too

Pablo Stanley

21,470 次观看 • 5 个月前

Introducing Code on Canvas in AI design tool for Claude and Codex. Design ❤️ Code are officially in a relationship, opening new ways to create on canvas. Ask agent to generate custom design tools inside Pencil on the fly, create interactive components, generative art and more, but still keep the full manual design control. This is just the beginning. Let us know what you think. And let's take it to the next level together. Download the new Pencil update today.

Introducing Code on Canvas in AI design tool for Claude and Codex. Design ❤️ Code are officially in a relationship, opening new ways to create on canvas. Ask agent to generate custom design tools inside Pencil on the fly, create interactive components, generative art and more, but still keep the full manual design control. This is just the beginning. Let us know what you think. And let's take it to the next level together. Download the new Pencil update today.

Tom Krcha

79,526 次观看 • 3 个月前

Introducing the new dev-browser cli. The fastest way for an agent to use a browser is to let it write code. Just `npm i -g dev-browser` and tell your agent to "use dev-browser"

Introducing the new dev-browser cli. The fastest way for an agent to use a browser is to let it write code. Just `npm i -g dev-browser` and tell your agent to "use dev-browser"

Sawyer Hood

867,564 次观看 • 4 个月前

HTML canvas has always been a black box to the browser, but not anymore. The HTML-in-Canvas API lets you integrate real DOM elements directly into the canvas, making them fully searchable, accessible, natively translatable, and inspectable. Fuse shaders and semantics to build new UI, eliminating the need for separate DOM overlays → The web is about to get a whole lot more whimsical and we can't wait to see it 🎨

HTML canvas has always been a black box to the browser, but not anymore. The HTML-in-Canvas API lets you integrate real DOM elements directly into the canvas, making them fully searchable, accessible, natively translatable, and inspectable. Fuse shaders and semantics to build new UI, eliminating the need for separate DOM overlays → The web is about to get a whole lot more whimsical and we can't wait to see it 🎨

Chrome for Developers

41,526 次观看 • 1 个月前

The best way to design and build with your repository is Cursor/Codex + MagicPath. Watch me import components from my repo into the MagicPath canvas inside Cursor, then explore completely different variations. All while they stay interactive and faithful to the source code 👇

The best way to design and build with your repository is Cursor/Codex + MagicPath. Watch me import components from my repo into the MagicPath canvas inside Cursor, then explore completely different variations. All while they stay interactive and faithful to the source code 👇

Pietro Schirano

28,051 次观看 • 1 个月前

That gap between design and production? Closed. 🔁 GitHub Copilot, Visual Studio Code, and Figma now create a continuous loop. With the bidirectional Figma MCP server, Copilot users can: 🔹 Pull design context into code 🔹 Push working UI back to the canvas Connect your canvas and stay in the flow. 👇

That gap between design and production? Closed. 🔁 GitHub Copilot, Visual Studio Code, and Figma now create a continuous loop. With the bidirectional Figma MCP server, Copilot users can: 🔹 Pull design context into code 🔹 Push working UI back to the canvas Connect your canvas and stay in the flow. 👇

GitHub

113,179 次观看 • 4 个月前

Introducing Kanvas a visual workspace to think, plan, and build ideas on a single canvas Built using the html canvas api >Collaborate in real time >Create freely or stay structured >Design with AI help >Privacy Kanvas is simple, visual, and powerful , with AI built right into the canvas link in comment

Introducing Kanvas a visual workspace to think, plan, and build ideas on a single canvas Built using the html canvas api >Collaborate in real time >Create freely or stay structured >Design with AI help >Privacy Kanvas is simple, visual, and powerful , with AI built right into the canvas link in comment

deep

17,688 次观看 • 6 个月前

i shit you not, it's an IDE AND has browser embeds, so I can localhost multiple pages at once in the same canvas obsidian's canvas being able to embed ANYTHING, and the Obsidian editor being literally just code-mirror, makes it the perfect worspace (tldraw is also cool)

i shit you not, it's an IDE AND has browser embeds, so I can localhost multiple pages at once in the same canvas obsidian's canvas being able to embed ANYTHING, and the Obsidian editor being literally just code-mirror, makes it the perfect worspace (tldraw is also cool)

Igor bedesqui

78,297 次观看 • 5 个月前

I've always liked the infinite canvas as an exploration medium, but I could never get into Figma because I'm faster at designing in code So this weekend I made an app that combines canvas with code editor - write React, and it appears in the canvas

I've always liked the infinite canvas as an exploration medium, but I could never get into Figma because I'm faster at designing in code So this weekend I made an app that combines canvas with code editor - write React, and it appears in the canvas

nanda

78,982 次观看 • 3 个月前

Copy code-backed screens → paste as design layers, now with variables → Copy your Make onto the canvas as design layers → Generate a design through the Figma MCP server → Capture your webpage as editable layers with the Chrome extension

Copy code-backed screens → paste as design layers, now with variables → Copy your Make onto the canvas as design layers → Generate a design through the Figma MCP server → Capture your webpage as editable layers with the Chrome extension

Figma

40,110 次观看 • 17 天前

Design → code → canvas → feedback → repeat. The Figma MCP server is now bidirectional. GitHub Copilot users can pull design context into code and push working UI back to the Figma canvas, all from Visual Studio Code . No handoffs or context switching. Just flow.

Design → code → canvas → feedback → repeat. The Figma MCP server is now bidirectional. GitHub Copilot users can pull design context into code and push working UI back to the Figma canvas, all from Visual Studio Code . No handoffs or context switching. Just flow.

Mario Rodriguez

105,816 次观看 • 4 个月前

Here is a quick walkthrough of everything new in Stitch: 🎨 The AI-native canvas can hold and reason across images, code, and text simultaneously. The new agent manager helps you design in parallel. (PS … light mode!) 🧠 A smarter design agent now understands your entire canvas context. You can swap images, generate product briefs, or mix mobile and desktop screens on the same canvas. 🎙️ You can vibe design with your voice (in Preview). Stitch can ‘see’ your canvas and your selected screens. You can ask for design critiques, variations, or navigate your canvas. ⚡️ Instant prototypes. Just hit the play button to see a prototype or preview your app in seconds. Stitch can imagine the next screen based on your mouse click. 📐 DESIGN.md and consistency. Every new design automatically starts with a cohesive design system which vastly improves consistency. The new DESIGN.md file can be used to export or import your design rules. Walkthrough video👇 Details for each major improvement 🧵

Here is a quick walkthrough of everything new in Stitch: 🎨 The AI-native canvas can hold and reason across images, code, and text simultaneously. The new agent manager helps you design in parallel. (PS … light mode!) 🧠 A smarter design agent now understands your entire canvas context. You can swap images, generate product briefs, or mix mobile and desktop screens on the same canvas. 🎙️ You can vibe design with your voice (in Preview). Stitch can ‘see’ your canvas and your selected screens. You can ask for design critiques, variations, or navigate your canvas. ⚡️ Instant prototypes. Just hit the play button to see a prototype or preview your app in seconds. Stitch can imagine the next screen based on your mouse click. 📐 DESIGN.md and consistency. Every new design automatically starts with a cohesive design system which vastly improves consistency. The new DESIGN.md file can be used to export or import your design rules. Walkthrough video👇 Details for each major improvement 🧵

Stitch by Google

488,040 次观看 • 4 个月前

For years, the design industry has talked about "design vs code" And tools (including Figma!) have forced a choice. But this is a false debate. Code isn't the opposite of design. Code is a material for design. So we're bringing code to the Figma canvas with Code Layers.

For years, the design industry has talked about "design vs code" And tools (including Figma!) have forced a choice. But this is a false debate. Code isn't the opposite of design. Code is a material for design. So we're bringing code to the Figma canvas with Code Layers.

Dylan Field

96,614 次观看 • 1 个月前

browser-use agents are now part of ai-gradio in a few lines of code you can launch agents to interact with the browser import gradio as gr import ai_gradio demo = gr.load( name='browser:gpt-4-turbo', src=ai_gradio.registry, title='Browser Agent', description='AI agent that can interact with web browsers' ).launch()

browser-use agents are now part of ai-gradio in a few lines of code you can launch agents to interact with the browser import gradio as gr import ai_gradio demo = gr.load( name='browser:gpt-4-turbo', src=ai_gradio.registry, title='Browser Agent', description='AI agent that can interact with web browsers' ).launch()

AK

81,404 次观看 • 1 年前

I gave Kimi K2.6 and K2.7 Code the exact same prompt to animate a letter burning to ash. Pure HTML canvas, zero libraries.

I gave Kimi K2.6 and K2.7 Code the exact same prompt to animate a letter burning to ash. Pure HTML canvas, zero libraries.

stevibe

89,828 次观看 • 1 个月前

Introducing Codex to Figma: Roundtrip between code and canvas through the Figma MCP server

Introducing Codex to Figma: Roundtrip between code and canvas through the Figma MCP server

Figma

179,484 次观看 • 5 个月前

🎨 Design freely with Agent 4. - Design while the agent builds. - Explore multiple UI variants on an infinite canvas. - Make precise UI edits that you can apply directly to your app.

🎨 Design freely with Agent 4. - Design while the agent builds. - Explore multiple UI variants on an infinite canvas. - Make precise UI edits that you can apply directly to your app.

Replit ⠕

184,057 次观看 • 4 个月前

Today we’re launching Design Canvas for AI agents. AI can build a feature, but every "design tweak" turns into another prompt. We built a drag & drop editor for Claude Code, Cursor, Codex to explore and iterate on your UI, so you get the best design by default. No endless prompting. Ship better designs in code with Subframe.

Today we’re launching Design Canvas for AI agents. AI can build a feature, but every "design tweak" turns into another prompt. We built a drag & drop editor for Claude Code, Cursor, Codex to explore and iterate on your UI, so you get the best design by default. No endless prompting. Ship better designs in code with Subframe.

Irvin Zhan

300,276 次观看 • 5 个月前

Introducing Oz: the platform to orchestrate agents in the cloud. Spin up hundreds of agents from your terminal, browser, the API, or your phone. Each agent gets a @docker environment to build, test, and write PRs. Come back from your lunch break to code that’s ready to merge.

Introducing Oz: the platform to orchestrate agents in the cloud. Spin up hundreds of agents from your terminal, browser, the API, or your phone. Each agent gets a @docker environment to build, test, and write PRs. Come back from your lunch break to code that’s ready to merge.

Warp

2,371,773 次观看 • 5 个月前

tldraw canvas ➡️ interactive theme UI Demonstrating visual context understanding in Antigravity, the agent read the canvas mockups and built interactive code fast with 3.6 Flash⚡

tldraw canvas ➡️ interactive theme UI Demonstrating visual context understanding in Antigravity, the agent read the canvas mockups and built interactive code fast with 3.6 Flash⚡

Google Antigravity

54,103 次观看 • 4 天前