Dokumentasi

Cara kerja Design Extractor

Tempel URL, dapatkan spesifikasi desain yang terstruktur. Warna, tipografi, spacing, dan komponen dalam DESIGN.md yang bisa langsung Anda taruh di repo.

Apa itu DESIGN.md?

DESIGN.md adalah dokumen sistem desain berbentuk teks biasa yang bisa dibaca manusia maupun agen AI. Anggap saja sebagai pasangan desain dari AGENTS.md. Jika AGENTS.md memberi tahu agen cara membangun proyek, DESIGN.md memberi tahu bagaimana tampilan dan nuansanya.

Di dalamnya, setiap DESIGN.md punya dua lapisan: front matter YAML dengan token desain yang bisa dibaca mesin, dan isi markdown yang menjelaskan alasan desainnya. Token memberi agen nilai yang presisi. Teks menjelaskan mengapa nilai-nilai itu ada.

Baca spesifikasi DESIGN.md lengkap ->

Bagian kanonis

  • Overview
  • Colors
  • Typography
  • Layout
  • Elevation & Depth
  • Shapes
  • Components
  • Do's and Don'ts

Cara kerja

  1. Input

    Tempel URL publik (misalnya design-extractor.com).

  2. Ekstraksi

    Sistem menelusuri halaman dan menganalisis properti visualnya: warna, tipografi, spacing, pola komponen, dan bahasa desain secara keseluruhan.

  3. Output

    Satu DESIGN.md yang berisi:

    • Overview dan panduan gaya brand
    • Palet warna dengan token bernama
    • Level tipografi dan properti font
    • Token layout, spacing, dan bentuk
    • Panduan komponen dan referensi token
    • Do's and don'ts yang berfungsi sebagai pagar pembatas desain

Output

Setiap ekstraksi menghasilkan satu DESIGN.md.

Markdown

  • DESIGN.md. Format DESIGN.md kanonis diperkenalkan oleh Google Stitch. Taruh di repo mana pun agar bisa dipakai agen AI.

Ekstensi Chrome

Ekstrak halaman di tab yang sedang Anda buka tanpa perlu kembali ke sini. Ekstensi memakai ulang sesi Anda di situs dan memakai kredit yang sama. Baca cara kerja ekstensi ->

Wawasan utamanya

Agen AI menghasilkan desain yang lebih baik jika diberi token yang presisi sekaligus alasan yang bisa dibaca manusia. Front matter YAML memberi nilai yang persis. Isi markdown menjelaskan bagaimana nilai-nilai itu dipakai dalam praktik.

Siap mencobanya?

Dapatkan DESIGN.md dari URL publik apa pun. Ekstraksi memakan waktu setidaknya satu menit.

Ekstrak situs