icon of getdesign

getdesign

www.getdesign.app

Trích xuất hệ thống thiết kế của một trang web vào tệp design.md

Truy cập websiteMở trong cửa sổ mới
image of getdesignTruy cập website

getdesign là gì?

getdesign trích xuất một hệ thống thiết kế từ một trang web công khai. Nó mở trang web trong một trình duyệt thật, đọc CSS của trang và ghi lại trang đã kết xuất, sau đó ghi màu sắc, kiểu chữ, khoảng cách và thành phần của trang vào một tệp design.md dựa trên CSS thực tế của trang web. Kết quả có thể được đọc như một hướng dẫn phong cách hoặc đưa cho một tác nhân lập trình làm ngữ cảnh khi xây dựng giao diện.

Công cụ này có sẵn trên năm bề mặt chia sẻ cùng một lõi tác nhân, cùng với một Skill chạy bên trong một tác nhân lập trình. Hiện tại nó đang ở phiên bản beta, và các lần chạy được lưu trữ dựa vào khóa nhà cung cấp của riêng bạn thay vì khóa API getdesign.

Cách sử dụng getdesign?

Bảng điều khiển web

Đăng nhập vào bảng điều khiển, lưu khóa Daytona và OpenAI của bạn trong Account, sau đó dán URL trang web công khai vào Agent để tạo design.md. Bạn cũng có thể khám phá các ví dụ đã lưu trong bộ nhớ đệm mà không cần chạy nhà cung cấp.

API

GET /v1/design tại api.getdesign.app trả về Markdown hoặc JSON. Cần xác thực bearer WorkOS và khóa nhà cung cấp.

CLI

Chạy bunx @getdesign/cli trên Bun với khóa Daytona và OpenAI của bạn. Nó ghi design.md vào một tệp cục bộ.

SDK

Cài đặt @getdesign/sdk bằng bun add @getdesign/sdk để chạy tác nhân trong tiến trình trên Bun, với kết quả có kiểu và sự kiện tiến độ, sử dụng khóa nhà cung cấp của bạn.

Skill

Thêm SKILL.md di động bằng skills add MohtashamMurshid/getdesign. Nó chạy bên trong Claude Code, Codex hoặc Cursor, sử dụng các công cụ của chính tác nhân.

Các tính năng chính của getdesign

Trích xuất hệ thống thiết kế

getdesign đọc các token CSS của một trang công khai, ghi lại trang trong trình duyệt và tạo ra một tài liệu thiết kế bao gồm màu sắc, kiểu chữ, khoảng cách và thành phần.

Đầu ra design.md

Kết quả được cung cấp dưới dạng tài liệu Markdown mô tả hệ thống thiết kế của trang web. Các lần chạy trực quan cũng bao gồm ảnh chụp màn hình đã ghi lại.

Nhiều bề mặt truy cập

Web, API, CLI và SDK TypeScript truy cập cùng một lõi tác nhân; Skill chạy bên trong tác nhân lập trình của riêng bạn. CLI và SDK chạy cục bộ trên Bun, trong khi API HTTP hỗ trợ các lần chạy được lưu trữ.

Các lần chạy riêng tư với tùy chọn xuất bản

Các lần chạy trên bảng điều khiển vẫn riêng tư cho đến khi bạn xuất bản chúng. Xuất bản tạo một liên kết mà bất kỳ ai cũng có thể dùng để xem và tải xuống tài liệu thiết kế và ảnh chụp màn hình; bạn có thể đặt lại một lần chạy thành riêng tư để đóng quyền truy cập trong tương lai, mặc dù các bản sao đã tải xuống vẫn thuộc về người nhận.

Các trường hợp sử dụng getdesign

Tạo hướng dẫn phong cách từ một trang web trực tiếp

Tạo một tài liệu thiết kế dễ đọc từ một trang web công khai mô tả màu sắc, kiểu chữ, khoảng cách và thành phần của trang.

Cung cấp ngữ cảnh thiết kế cho một tác nhân lập trình

Chuyển design.md đã tạo và ảnh chụp màn hình của nó cho một tác nhân lập trình, hoặc cài đặt Skill để tác nhân trích xuất ngữ cảnh thiết kế bằng các công cụ của chính nó.

Chạy trích xuất trong quy trình cục bộ hoặc được lưu trữ

Dùng CLI hoặc SDK TypeScript cho các lần chạy cục bộ trên Bun, hoặc API HTTP cho các lần chạy được lưu trữ trả về Markdown hoặc JSON.

Chia sẻ một tài liệu thiết kế

Xuất bản một lần chạy trên bảng điều khiển để tạo một liên kết mà người khác có thể dùng để xem và tải xuống tài liệu thiết kế và ảnh chụp màn hình.

Các câu hỏi thường gặp về getdesign

Tệp design.md là gì?

design.md là một tài liệu Markdown mô tả hệ thống thiết kế của một trang web. Bạn có thể đọc nó như một hướng dẫn phong cách hoặc đưa nó cho một tác nhân lập trình làm ngữ cảnh khi xây dựng giao diện. Các lần chạy trực quan cũng bao gồm ảnh chụp màn hình đã ghi lại.

Làm cách nào để trích xuất màu sắc và phông chữ của một trang web?

Lưu khóa Daytona và OpenAI của bạn trong Account, sau đó dán URL trang web công khai vào Agent. getdesign đọc các token CSS, ghi lại trang trong trình duyệt và tạo một tài liệu thiết kế mà bạn có thể tải xuống. Bạn cũng có thể khám phá các ví dụ đã lưu trong bộ nhớ đệm mà không cần chạy nhà cung cấp.

Tôi có thể dùng getdesign với một tác nhân lập trình không?

Có. Đưa cho tác nhân lập trình của bạn design.md đã tạo và ảnh chụp màn hình của nó, hoặc cài đặt getdesign Skill để trích xuất ngữ cảnh thiết kế bằng các công cụ của chính tác nhân. CLI và SDK TypeScript cũng chạy cục bộ trên Bun, và API HTTP hỗ trợ các lần chạy được lưu trữ.

Có xác thực hoặc gói trả phí không?

Bảng điều khiển sử dụng đăng nhập WorkOS. Các lần chạy được lưu trữ yêu cầu khóa Daytona và OpenAI của riêng bạn; không có khóa API getdesign trong V1. V1 không có tính phí chạy getdesign. Bạn trả tiền cho Daytona để ghi lại trình duyệt và cho OpenAI để sử dụng mô hình.

Các lần chạy thiết kế của tôi có công khai không?

Các lần chạy trên bảng điều khiển của bạn là riêng tư cho đến khi bạn xuất bản chúng. Xuất bản tạo một liên kết mà bất kỳ ai cũng có thể dùng để xem và tải xuống tài liệu thiết kế và ảnh chụp màn hình. Bạn có thể đặt lại một lần chạy thành riêng tư để đóng quyền truy cập trong tương lai; các bản sao đã tải xuống vẫn thuộc về người nhận.

Công cụ tương tự

Khám phá danh mục