GPT-4-Vision: Convert Screenshots to Code Instantly

Описание к видео GPT-4-Vision: Convert Screenshots to Code Instantly

In this video, I will demonstrate the new open-source Screenshot-to-Code project, which enables you to upload a simple photo, be it a full webpage or a basic UI component, and it will generate the HTML with Tailwind classes to render the output. I will show you how to set this up locally and demonstrate some of the outputs it generated, such as the Wikipedia page. Additionally, I will provide a quick example of how you can take a photo of something like the ChatGPT input area and tweak the UI result's output if further refinements are needed.

Links:
https://github.com/abi/screenshot-to-...
https://www.python.org/downloads/
https://python-poetry.org/docs/
https://platform.openai.com/api-keys
http://localhost:5173/

Clipboard tips and tricks:

Windows 10 and later:

Use Windows + Shift + S.
This activates the Snip & Sketch tool, allowing you to drag and select a portion of your screen.
The selected area is then copied to the clipboard automatically.
macOS:

Press Command + Shift + 4.
This changes your cursor to a crosshair, letting you select a portion of the screen.
Hold Control while dragging to copy the selected area to the clipboard instead of saving it as a file.
Linux (with GNOME desktop environment):

Use Shift + PrintScreen.
This allows you to select an area of the screen to capture.
The screenshot is then copied to the clipboard.

Support the channel:
Patreon: Support me on Patreon at patreon.com/DevelopersDigest
Buy Me A Coffee: You can buy me a coffee at buymeacoffee.com/developersdigest
Website: Check out my website at developersdigest.tech
Github: Follow me on GitHub at github.com/developersdigest
Twitter: Follow me on Twitter at twitter.com/dev__digest

Комментарии

Информация по комментариям в разработке