正在加载视频...

视频加载失败

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

Introducing Canvas UI, the first ever html-in-canvas component library. Your DOM is the render target now. Real-time shaders over real, interactive UI. 24 components. React, Vue, Svelte, vanilla TS. Free. Open source. 🧵

David Haz

9,831 subscribers

913,602 次观看 • 23 小时前 •via X (Twitter)

艺术科学技术教育

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

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

相关视频

Here’s a first look at the Shaders Design Editor ✨ From blank canvas to interactive hero section in 2 minutes⏱️. Shipping soon for Vue, React & Svelte.

Here’s a first look at the Shaders Design Editor ✨ From blank canvas to interactive hero section in 2 minutes⏱️. Shipping soon for Vue, React & Svelte.

shaders

63,314 次观看 • 9 个月前

These are real WebGL shaders on top of interactive DOM elements without the HTML-in-Canvas API (works in Safari too). There’re rough edges still but worth sharing:

These are real WebGL shaders on top of interactive DOM elements without the HTML-in-Canvas API (works in Safari too). There’re rough edges still but worth sharing:

Shu

56,459 次观看 • 3 个月前

🚀 Announcing Ark UI Ark™ The robust headless UI component library, built with State machines 🥳💪✨ 🔸Over 30+ components (ColorPicker, DatePicker, and more...) 🔸Works in React, Solid, and Vue 🔸Bring your own styling solution

🚀 Announcing Ark UI Ark™ The robust headless UI component library, built with State machines 🥳💪✨ 🔸Over 30+ components (ColorPicker, DatePicker, and more...) 🔸Works in React, Solid, and Vue 🔸Bring your own styling solution

Sage ⚡️

159,213 次观看 • 2 年前

Introducing Public Beta for Shaders ✨ The wait is over 🎉 Try it now for Vue , React , Svelte & SolidJS

Introducing Public Beta for Shaders ✨ The wait is over 🎉 Try it now for Vue , React , Svelte & SolidJS

shaders

88,699 次观看 • 5 个月前

Introducing ! 🤩🎉 Open Source alternative v0! Generate usable Vue component, not just UI. Support `shadcn/vue` for now, but will address more library in soon! Fork it, Host it, Star it ⭐️ --- Made with Nuxt Drizzle ORM shadcn UI

Introducing ! 🤩🎉 Open Source alternative v0! Generate usable Vue component, not just UI. Support `shadcn/vue` for now, but will address more library in soon! Fork it, Host it, Star it ⭐️ --- Made with Nuxt Drizzle ORM shadcn UI

Zernonia

295,928 次观看 • 2 年前

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,367 次观看 • 1 个月前

build an agent that speaks your UI. your charts. your forms. your seat maps. multi-turn, streaming, interactive. introducing tambo 1.0, the open-source generative UI toolkit for react.

build an agent that speaks your UI. your charts. your forms. your seat maps. multi-turn, streaming, interactive. introducing tambo 1.0, the open-source generative UI toolkit for react.

Michael Magán

261,592 次观看 • 5 个月前

What if you could watch a UI generate in real-time as you work with AI? Now you can, with Real Time UI in MagicPath. This is extremely hard to do, especially for interactive React components with states. That’s why you don’t see this anywhere else. This is a first.

What if you could watch a UI generate in real-time as you work with AI? Now you can, with Real Time UI in MagicPath. This is extremely hard to do, especially for interactive React components with states. That’s why you don’t see this anywhere else. This is a first.

Pietro Schirano

51,983 次观看 • 11 个月前

600 SVGs available on Svgl 🥳🚀 ✓ Fully optimized ✓ React, Vue, Angular, Astro, Svelte & Web Components ✓ Add SVGs with the shadcn/ui CLI ✓ Free API ✓ Raycast extension, npm packages, and CLIs built by contributors and 100% free, open source ✨

600 SVGs available on Svgl 🥳🚀 ✓ Fully optimized ✓ React, Vue, Angular, Astro, Svelte & Web Components ✓ Add SVGs with the shadcn/ui CLI ✓ Free API ✓ Raycast extension, npm packages, and CLIs built by contributors and 100% free, open source ✨

Pablo

95,527 次观看 • 4 个月前

Introducing 21st Agent Elements Diffed edits. Plan approvals. Clarifying questions. Sub-agents. Tool cards. The pieces every "agent UI" lib skips. 25 shadcn /ui components built for the new generation of agents that use your computer. Open-source. Link in thread 🧵

Introducing 21st Agent Elements Diffed edits. Plan approvals. Clarifying questions. Sub-agents. Tool cards. The pieces every "agent UI" lib skips. 25 shadcn /ui components built for the new generation of agents that use your computer. Open-source. Link in thread 🧵

serafim

44,036 次观看 • 3 个月前

Open-source and free apps for coders - 7000+ free SVG icons - Open-source collection of CSS cursors - Turns your Chrome into stable commands for the AI agents - Free design inspiration from top sites - Open-source animated UI Components for React

Open-source and free apps for coders - 7000+ free SVG icons - Open-source collection of CSS cursors - Turns your Chrome into stable commands for the AI agents - Free design inspiration from top sites - Open-source animated UI Components for React

Csaba Kissi

22,925 次观看 • 7 天前

Introducing Agents UI, an open-source shadcn component library for building polished React frontends for your voice agents. Audio visualizers. Media controls. Session management tools. Chat transcripts. All wired to LiveKit Agents. Install via the shadcn CLI and own the code.

Introducing Agents UI, an open-source shadcn component library for building polished React frontends for your voice agents. Audio visualizers. Media controls. Session management tools. Chat transcripts. All wired to LiveKit Agents. Install via the shadcn CLI and own the code.

LiveKit

182,887 次观看 • 4 个月前

💬assistant-ui is an open-source TypeScript/React library for AI chat. It brings a ChatGPT-like UI directly into your app. Get started via `npx assistant-ui init`. Congrats on the launch, Simon Farshid!

💬assistant-ui is an open-source TypeScript/React library for AI chat. It brings a ChatGPT-like UI directly into your app. Get started via `npx assistant-ui init`. Congrats on the launch, Simon Farshid!

Y Combinator

132,190 次观看 • 1 年前

With Canvas in Gemini, you can: ⌨️ Write, iterate & preview React/HTML code 📝 Draft & edit comprehensive documents 🎨 Build interactive prototypes, games & visualization …and more. Simply select ‘Canvas’ in your prompt bar and you can write and edit documents or code, with changes appearing in real-time: Try it today and share your Canvas creations by tagging us here!

With Canvas in Gemini, you can: ⌨️ Write, iterate & preview React/HTML code 📝 Draft & edit comprehensive documents 🎨 Build interactive prototypes, games & visualization …and more. Simply select ‘Canvas’ in your prompt bar and you can write and edit documents or code, with changes appearing in real-time: Try it today and share your Canvas creations by tagging us here!

Google Gemini

414,938 次观看 • 1 年前

Introducing the Generative UI Research Canvas ✨ Every agent needs a powerful UI Combine LangChain, Tavily, Tako and CopilotKit🪁 and you get a LangChain-based research agent with a Generative UI-driven frontend. When agents can explore the underlying data, research becomes more trustworthy and useful. How does this work? - LangChain manages the agent workflow and tool orchestration. - Tako converts retrieved data into structured, visual components - Tavily provides agentic search - CopilotKit renders those components in the UI and keeps the user in the loop while the agent is working So instead of a boring and static report, the output is an interactive research canvas that evolves as the agent runs. 2026 is the year where users want to see the output, not read it... Generative UI makes this possible for agentic applications. Tutorial: Open-Source Repo: Docs:

Introducing the Generative UI Research Canvas ✨ Every agent needs a powerful UI Combine LangChain, Tavily, Tako and CopilotKit🪁 and you get a LangChain-based research agent with a Generative UI-driven frontend. When agents can explore the underlying data, research becomes more trustworthy and useful. How does this work? - LangChain manages the agent workflow and tool orchestration. - Tako converts retrieved data into structured, visual components - Tavily provides agentic search - CopilotKit renders those components in the UI and keeps the user in the loop while the agent is working So instead of a boring and static report, the output is an interactive research canvas that evolves as the agent runs. 2026 is the year where users want to see the output, not read it... Generative UI makes this possible for agentic applications. Tutorial: Open-Source Repo: Docs:

Atai Barkai

11,997 次观看 • 5 个月前

Introducing Instant Apps — your Tasklet agent can now build live, interactive apps for you on-demand. Describe what you need & get the perfect custom UI in seconds — connected to your real, live data. 🧵

Introducing Instant Apps — your Tasklet agent can now build live, interactive apps for you on-demand. Describe what you need & get the perfect custom UI in seconds — connected to your real, live data. 🧵

Tasklet

12,599,624 次观看 • 4 个月前

Introducing Loading UI ⏳ if your loading state is just <Loader2 /> it's for you → 35+ components → shadcn compatible → simplest api, fully customizable free and open-source install, customize, plug-in check at loading-ui(.)com 🔥

Introducing Loading UI ⏳ if your loading state is just <Loader2 /> it's for you → 35+ components → shadcn compatible → simplest api, fully customizable free and open-source install, customize, plug-in check at loading-ui(.)com 🔥

Bart ⚡

105,535 次观看 • 2 个月前

Should agentic UI be controlled by the server or the host? 🤔 In mcp-ui, servers can now define the UI layout and effects, and hosts can render it with their own look and feel! Supports React and Web Components with Shopify's remote-dom. Hit us up with use cases (+Liad Yosef)

Should agentic UI be controlled by the server or the host? 🤔 In mcp-ui, servers can now define the UI layout and effects, and hosts can render it with their own look and feel! Supports React and Web Components with Shopify's remote-dom. Hit us up with use cases (+Liad Yosef)

Ido Salomon

25,037 次观看 • 1 年前

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,616 次观看 • 5 个月前

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.

Michael Magán

65,473 次观看 • 1 年前