Загрузка видео...

Не удалось загрузить видео

На главную

Available now in Visual Studio Code Insiders, you can select and add elements directly to Chat! After opening any locally-hosted site via the built-in Simple Browser, click "Start" on the toolbar and select the element you want. This will attach a screenshot of the selected element, as well as...

code's profile picture

Visual Studio Code

801,177 subscribers

75,499 просмотров • 1 год назад •via X (Twitter)

Наука и технологииОбразование
LIVE

Anya Rossi• Live Now

Private livecam show

Комментарии: 10

Фото профиля 🅰
🅰1 год назад

Really cool!

Фото профиля Francois Laberge ✍️
Francois Laberge ✍️1 год назад

Is there going to be an API at some point for VS Code extension writers to embed web-views (vs iframes now) with more privileges so that you can take screenshots and inject/instrument code easily? Severely limits what code generating extensions can do without it.

Фото профиля terry 🇺🇦
terry 🇺🇦1 год назад

how do i also get access to claude 3.7 sonnet? i have it enabled on my copilot settings, and i'm even part of a copilot for business right now. why the heck i can't switch from 4o the dumbest one?

Фото профиля Dom
Dom1 год назад

Downloading VSCode Insiders now – ready to dive into the new feature!

Фото профиля Evi
Evi1 год назад

I used all my credits, bye..👋

Фото профиля GuZi
GuZi1 год назад

Nice!

Фото профиля Oren Melamed
Oren Melamed1 год назад

already hyped on it 3 days ago!!!! this is killer feature

Фото профиля Ga Satrya
Ga Satrya1 год назад

Woah, that's really cool!

Фото профиля Shawn
Shawn1 год назад

yes microsoft, promote ai generation of nintendo assets in a marketing setting. surely there will be no repercussions

Фото профиля Pete Thorne
Pete Thorne1 год назад

I can't get this to work, I click "Select" and then click on elements but it's not detecting them?

Похожие видео

Did you know that Visual Studio Code has HAD a built-in browser! Say "start my app in simple browser" and it will run the dev server and open simple browser to localhost. It can take screenshots of the page or element and send DOM elements to the agent chat!
0:59

Did you know that Visual Studio Code has HAD a built-in browser! Say "start my app in simple browser" and it will run the dev server and open simple browser to localhost. It can take screenshots of the page or element and send DOM elements to the agent chat!

James Montemagno

47,489 просмотров • 7 месяцев назад

You can now add a live browser to Claude Code to click any element and edit it 🤯 Your app runs embedded. You click a button. Claude instantly knows the exact selector, the exact component, the exact location in your code. No more “the red button in the top left of the third card.” Just click it. 100% open source.
0:42

You can now add a live browser to Claude Code to click any element and edit it 🤯 Your app runs embedded. You click a button. Claude instantly knows the exact selector, the exact component, the exact location in your code. No more “the red button in the top left of the third card.” Just click it. 100% open source.

Alvaro Cintas

47,116 просмотров • 1 месяц назад

VFX-JS supports HTML-in-Canvas now. You can turn HTML element into a WebGL texture. It automatically detects the browser and fallback to the old SVG foreignObject workaround. So it works on Chrome, Firefox, and Safari, of course! #WebGL #VFXJS #Codepen
0:23

VFX-JS supports HTML-in-Canvas now. You can turn HTML element into a WebGL texture. It automatically detects the browser and fallback to the old SVG foreignObject workaround. So it works on Chrome, Firefox, and Safari, of course! #WebGL #VFXJS #Codepen

𝘼𝙈𝘼𝙂𝙄

51,990 просмотров • 1 месяц назад

I just released a handy little chrome extension 'clipmd' that lets you click on any element in a web page, and puts in the clipboard that element converted to markdown (ctrl-shift-m), or a screenshot of it (ctrl-shift-s). Handy for LLMs! 😊
0:22

I just released a handy little chrome extension 'clipmd' that lets you click on any element in a web page, and puts in the clipboard that element converted to markdown (ctrl-shift-m), or a screenshot of it (ctrl-shift-s). Handy for LLMs! 😊

Jeremy Howard

87,981 просмотров • 6 месяцев назад

You can now design directly in your codebase. Select elements, modify them visually, and Cursor writes the code.
2:05

You can now design directly in your codebase. Select elements, modify them visually, and Cursor writes the code.

Cursor

6,074,484 просмотров • 5 месяцев назад

Friendly reminder that you can go to any GitHub repo, press the . key, and the entire repo will open in the browser using Visual Studio Code
0:21

Friendly reminder that you can go to any GitHub repo, press the . key, and the entire repo will open in the browser using Visual Studio Code

Visual Studio Code

209,336 просмотров • 1 год назад

how do you get the size and position of an HTML element?
0:42

how do you get the size and position of an HTML element?

Aiden Bai

37,038 просмотров • 1 год назад

THIS GUY ADDED A LIVE BROWSER TO CLAUDE CODE SO YOU CAN CLICK ANY ELEMENT AND EDIT IT INSTANTLY biggest issue with vibe coding UI is that you have to describe what you want to change. if you prompt it the wrong selector or wrong component, Claude can't find it. now you just click it. your app runs in an embedded browser with Claude Code. you can click any button, any text, any div. Claude instantly knows exactly what you're pointing at. click. instruct. done. no more "change the button in the top right corner of the second card component." all you have to do now is just click the button. AND its open source
0:40

THIS GUY ADDED A LIVE BROWSER TO CLAUDE CODE SO YOU CAN CLICK ANY ELEMENT AND EDIT IT INSTANTLY biggest issue with vibe coding UI is that you have to describe what you want to change. if you prompt it the wrong selector or wrong component, Claude can't find it. now you just click it. your app runs in an embedded browser with Claude Code. you can click any button, any text, any div. Claude instantly knows exactly what you're pointing at. click. instruct. done. no more "change the button in the top right corner of the second card component." all you have to do now is just click the button. AND its open source

Om Patel

152,079 просмотров • 2 месяцев назад

JSX Tool (@jsxtool) is an in-browser IDE for building React UIs. Click on any element in the browser to jump straight to the relevant line of code and edit it yourself or provide precise context to an LLM to make updates.
3:51

JSX Tool (@jsxtool) is an in-browser IDE for building React UIs. Click on any element in the browser to jump straight to the relevant line of code and edit it yourself or provide precise context to an LLM to make updates.

Y Combinator

49,731 просмотров • 6 месяцев назад

Introducing @​renoun/screenshot 📸 Capture any HTML element as an image with pixel-perfect accuracy, including modern CSS features.
0:20

Introducing @​renoun/screenshot 📸 Capture any HTML element as an image with pixel-perfect accuracy, including modern CSS features.

Travis Arnold

57,720 просмотров • 5 месяцев назад

Open CodeGPT in VSCode, then select the Qwen 2.5 model by Qwen Press Command + Shift + K Add this prompt: "Create a single HTML file with embedded CSS and JavaScript that simulates the falling letters and numbers effect from The Matrix, covering the entire screen with green characters cascading down on a black background. The animation should run smoothly using the canvas element and JavaScript. Additionally, when the user moves the mouse over the falling characters, they should react by slightly shifting to the sides." Done! Now you have the Matrix effect running in your browser. 💊 Neo thanks you.
0:20

Open CodeGPT in VSCode, then select the Qwen 2.5 model by Qwen Press Command + Shift + K Add this prompt: "Create a single HTML file with embedded CSS and JavaScript that simulates the falling letters and numbers effect from The Matrix, covering the entire screen with green characters cascading down on a black background. The animation should run smoothly using the canvas element and JavaScript. Additionally, when the user moves the mouse over the falling characters, they should react by slightly shifting to the sides." Done! Now you have the Matrix effect running in your browser. 💊 Neo thanks you.

Daniel San

12,247 просмотров • 1 год назад

A quick Visual Studio Code tip you may not know: you can select bracket and string content with a simple double-click 🖱️
0:20

A quick Visual Studio Code tip you may not know: you can select bracket and string content with a simple double-click 🖱️

Visual Studio Code

589,503 просмотров • 1 месяц назад

Consistent characters from any angle. You can now create consistent characters and objects from any angle using Multi-Image Ref in Elements. → Upload up to 10 reference images → Save them as an Element → Tag them in your prompt → Specify the angle you want → Generate
0:37

Consistent characters from any angle. You can now create consistent characters and objects from any angle using Multi-Image Ref in Elements. → Upload up to 10 reference images → Save them as an Element → Tag them in your prompt → Specify the angle you want → Generate

LTX Studio

12,111 просмотров • 3 месяцев назад

Cursor now has a built-in web browser. You can say "start my app" and it will run the dev server in a terminal and then navigate the browser to localhost:3000. It can take screenshots of the page for iterating on design, and you can send DOM elements to the agent with prompts!
0:24

Cursor now has a built-in web browser. You can say "start my app" and it will run the dev server in a terminal and then navigate the browser to localhost:3000. It can take screenshots of the page for iterating on design, and you can send DOM elements to the agent with prompts!

Lee Robinson

216,060 просмотров • 7 месяцев назад

In-browser annotations are coming to Polyscope 🔥 Select any element in your browser → Polyscope will create a new workspace → Claude, Codex or Cursor knows what to change Zero copy paste Zero complex configuration Built with the Polyscope JS SDK 🚀
5:08

In-browser annotations are coming to Polyscope 🔥 Select any element in your browser → Polyscope will create a new workspace → Claude, Codex or Cursor knows what to change Zero copy paste Zero complex configuration Built with the Polyscope JS SDK 🚀

Marcel Pociot 🧪

13,247 просмотров • 2 месяцев назад

🔥 CSS Tip! Have you ever wanted the benefits of a block element but the sizing of an inline element? width: max-content; comes in super handy here 👌
1:00

🔥 CSS Tip! Have you ever wanted the benefits of a block element but the sizing of an inline element? width: max-content; comes in super handy here 👌

Wes Bos

23,420 просмотров • 1 год назад

Today we're launching the custom element. It might just be one element, but it gives you the *full* power of HTML.
0:39

Today we're launching the custom element. It might just be one element, but it gives you the *full* power of HTML.

Webflow

187,437 просмотров • 2 лет назад

I'm sick of the CSS centering jokes. You can now vertically center the contents of a block level element without Grid of Flexbox!
1:02

I'm sick of the CSS centering jokes. You can now vertically center the contents of a block level element without Grid of Flexbox!

Wes Bos

136,447 просмотров • 1 год назад

📢 New in Visual Studio: Bring Your Own Model to Chat We’re expanding flexibility in Copilot for Visual Studio. You can now connect API keys from providers like OpenAI, Anthropic, and Google to run Chat on the model of your choice. This update gives you: ✅ Choice – Access the latest models beyond the built-in defaults. ✅ Customization – Select models that fit your infrastructure and requirements. ✅ Control – Manage API usage, limits, and billing directly with your provider. ✅ Flexibility – Switch seamlessly between Copilot’s built-in models and your own. This release is the first step toward a more open and customizable chat experience in Visual Studio, with more providers and capabilities to come. 🔗
0:26

📢 New in Visual Studio: Bring Your Own Model to Chat We’re expanding flexibility in Copilot for Visual Studio. You can now connect API keys from providers like OpenAI, Anthropic, and Google to run Chat on the model of your choice. This update gives you: ✅ Choice – Access the latest models beyond the built-in defaults. ✅ Customization – Select models that fit your infrastructure and requirements. ✅ Control – Manage API usage, limits, and billing directly with your provider. ✅ Flexibility – Switch seamlessly between Copilot’s built-in models and your own. This release is the first step toward a more open and customizable chat experience in Visual Studio, with more providers and capabilities to come. 🔗

Visual Studio

11,873 просмотров • 9 месяцев назад

The new GitHub Copilot Visual Studio Code Ask Questions tool is really cool - and has lot's of potential! As a start - real improvement for saving premium requests as the agent can halt mid-turn to ask the user questions - great for the built-in plan mode Try now in Insiders
0:29

The new GitHub Copilot Visual Studio Code Ask Questions tool is really cool - and has lot's of potential! As a start - real improvement for saving premium requests as the agent can halt mid-turn to ask the user questions - great for the built-in plan mode Try now in Insiders

Oren Melamed

15,277 просмотров • 4 месяцев назад