Refero Styles vs Design Extractor
Design Extractor membuat DESIGN.md dari URL publik apa pun yang Anda berikan. File-nya mengikuti spesifikasi DESIGN.md dari Google dan menyertakan setiap komponen yang dipilihnya dari halaman sebagai resep HTML dan CSS yang bisa dibangun ulang oleh agen coding Anda. Setiap resep dicek terhadap situs live atau ditandai beserta alasannya. Design Extractor juga bisa dipakai untuk situs yang hanya merespons pengunjung dari negara tertentu.
Refero Styles adalah library gratis yang besar berisi style website, masing-masing dengan warna, tipografi, spacing, dan komponennya dalam beberapa format. Baru mengenal format ini? Baca apa itu DESIGN.md.
Dicek pada terhadap styles.refero.design, salah satu halaman style-nya dan sitemap style-nya. Penawaran dan harga bisa berubah, jadi cek situs mereka sebelum Anda memutuskan.
Mengapa Design Extractor
Mengikuti spesifikasi DESIGN.md dari Google
Front matter YAML hanya memakai properti yang didefinisikan spesifikasi, tanpa key top-level kustom. Bagian-bagian kanonis muncul sesuai urutan spesifikasi, dari Overview hingga Do's and Don'ts. Entri komponen di front matter hanya memakai delapan properti dari spesifikasi, dengan nilai literal. Cek file apa pun dengan Validator DESIGN.md gratis.
Resep untuk setiap komponen yang dipilihnya dari halaman
Header, footer, tombol, input, kartu, dan komponen lain yang dipilih dari halaman masing-masing disertakan sebagai resep: HTML dan CSS yang disaring dengan nilai literal, di dalam bagian Components pada DESIGN.md. Setiap resep mencantumkan bagian-bagiannya serta state hover dan focus yang terlihat di situs, sehingga agen coding Anda bisa membangun ulang komponen itu alih-alih menebaknya.
Diverifikasi terhadap situs live
Setiap resep dirender secara terpisah dan dicek terhadap situs live: pencocokan struktur bagian-bagian yang dirender dengan yang diukur di halaman, dan perbandingan piksel dengan tangkapan baru dari elemen aslinya. Resep yang gagal dibangun ulang dan dicek lagi. Resep yang tetap tidak lolos ditandai beserta alasannya, tidak pernah dikirim sebagai terverifikasi. Halaman hasil menampilkan seberapa cocok komponennya dan berapa banyak warna serta gaya teks situs yang tercakup: lihat Stripe di galeri.
Bisa untuk situs yang dibatasi wilayah
Beberapa situs hanya merespons pengunjung dari negara tertentu. Jika ekstraksi gagal karena hal itu, halaman hasil menawarkan pemilih negara, dengan negara tempat halaman itu terdeteksi bisa dimuat di urutan teratas, lalu menjalankan ekstraksi yang sama lewat browser di negara yang Anda pilih. Ekstraksi dari negara lain memakai harga Pro ditambah biaya tambahan 6 kredit (16 kredit). Jika ekstraksi gagal, kami mengembalikan kredit Anda.
Berdampingan
| Refero Styles | Design Extractor | |
|---|---|---|
| Kesesuaian spesifikasi | Tidak ditawarkan | Mengikuti spesifikasi DESIGN.md dari Google: front matter yang hanya berisi properti dari spesifikasi tanpa key top-level kustom, bagian-bagian kanonis sesuai urutan spesifikasi, dan entri komponen yang dibatasi pada delapan properti dari spesifikasi dengan nilai literal. |
| Resep komponen | Setiap komponen dideskripsikan dalam bentuk prosa, dengan peran dan ukurannya, tanpa HTML. | Setiap komponen yang dipilihnya dari halaman, seperti header, footer, tombol, input, dan kartu, disertakan sebagai resep: HTML dan CSS yang disaring di bagian Components, sehingga agen coding Anda bisa membangunnya ulang. |
| Diverifikasi terhadap situs live | Tidak ditawarkan | Ya. Setiap resep dirender secara terpisah dan dicek terhadap situs live: pencocokan struktur bagian-bagiannya dan perbandingan piksel. Komponen yang tidak lolos ditandai beserta alasannya, tidak pernah dikirim sebagai terverifikasi. |
| Situs yang dibatasi wilayah | Tidak ditawarkan | Ya. Jika sebuah situs memblokir pengunjung dari beberapa negara, ekstraksi yang gagal menawarkan pemilih negara, dengan negara tempat halaman itu bisa dimuat di urutan teratas, lalu menjalankan ekstraksi yang sama lewat browser di sana. Ekstraksi dari negara lain memakai harga Pro ditambah biaya tambahan 6 kredit (16 kredit). |
| Apa itu | Library gratis berisi style website, masih beta, dari Refero, produk referensi UI di refero.design. | Generator: Anda memberinya URL publik, dan generator mengembalikan DESIGN.md situs tersebut. |
| Website apa pun sesuai permintaan | Tidak ditawarkan | Ya. Tempel URL publik apa pun dan ekstraksi langsung dimulai. |
| Cakupan | 1.342 halaman style, sebagaimana tercantum di sitemap style-nya. | Website publik apa pun, ditambah galeri berisi brand yang sudah diekstrak. |
| Format per style | DESIGN.md (compact dan extended), Tailwind v4, variabel CSS, dan token desain. | Satu DESIGN.md, dengan token di front matter dan resep komponen dalam HTML dan CSS. |
| Harga | Gratis untuk dijelajahi dan disalin. | Kredit prabayar, tanpa langganan. Paket mulai dari US$5 untuk 50 kredit; ekstraksi Pro memakai 10 kredit. |
| Kebaruan | Snapshot. Style Apple diekstrak pada 2026-09-20. | Dibuat dari situs live pada saat Anda menjalankannya. |
| Akses agen | Setiap halaman style menautkan ke MCP milik Refero untuk Claude, ChatGPT, Cursor, Codex, dan lainnya. | Server MCP remote dengan tool ekstrak yang menerima URL apa pun, dari Claude Code, claude.ai, ChatGPT, Codex, Cursor, dan klien lain. |
| Ekstensi browser | Tidak ditawarkan | Ekstensi Chrome yang mengekstrak tab yang sedang Anda buka. |
Yang ditawarkan Refero Styles
- Library gratis berisi style website, bisa dijelajahi berdasarkan nuansa seperti SaaS mode gelap atau layout editorial.
- Beberapa format per style: DESIGN.md (compact dan extended), Tailwind v4, variabel CSS, dan token desain.
- Tautan ke MCP milik Refero untuk Claude, ChatGPT, Cursor, Codex, dan lainnya.
Library vs URL apa pun sesuai permintaan
Library mencakup situs-situs yang sudah ditambahkan seseorang ke dalamnya. Design Extractor membaca situs live yang Anda sebutkan, jadi bisa mencakup produk Anda sendiri, klien, kompetitor, atau brand niche, sebagaimana tampilannya hari ini.
Tempel URL di beranda, atau biarkan agen Anda melakukannya lewat server MCP. Lihat file yang sudah jadi, beserta resep dan hasil pengecekannya, di galeri.
Cara beralih dari Refero Styles
- Tempel URL situs di beranda Design Extractor dan jalankan ekstraksi Pro.
- Simpan hasilnya sebagai DESIGN.md di root repository Anda dan pertahankan rujukannya di AGENTS.md atau CLAUDE.md. Cek editan manual dengan Validator DESIGN.md gratis.
- Atau biarkan agen Anda yang melakukannya: hubungkan server MCP dan minta agen mengekstrak situs tersebut.
Kesimpulan
Pilih Design Extractor jika Anda butuh DESIGN.md untuk situs publik apa pun, bukan hanya situs yang ada di sebuah library, dengan resep komponen yang dicek terhadap situs live. Design Extractor membaca situs sebagaimana tampilannya sekarang dan mengikuti spesifikasi Google, dengan resep untuk setiap komponen yang dipilihnya dari halaman, yang ditandai beserta alasannya jika tidak lolos. Design Extractor bisa menjangkau situs yang dibatasi wilayah. Agen Anda bisa menjalankannya lewat MCP.
Perbandingan lainnya
getdesign.md vs Design Extractor
Koleksi kurasi file DESIGN.md siap pakai dibandingkan dengan DESIGN.md yang sesuai spesifikasi, dengan resep komponen yang dicek terhadap situs live, dari URL apa pun.
designmd.me vs Design Extractor
Dua generator URL ke DESIGN.md dibandingkan dari sisi kesesuaian spesifikasi, resep komponen, pengecekan terhadap situs live, dan harga.
TypeUI vs Design Extractor
Ekstensi Chrome gratis dari TypeUI, yang mengisi template miliknya sendiri dari style di tab Anda, dibandingkan dengan DESIGN.md yang sesuai spesifikasi dengan resep komponen yang dicek terhadap situs live.
FAQ
Refero Styles vs Design Extractor: pertanyaan
Jawaban singkat tentang Refero Styles dan Design Extractor, dicek pada 2026-10-20.
Ya. Pada 2026-10-20, menjelajahi dan menyalin style di styles.refero.design gratis. Halaman-halamannya menautkan ke MCP milik Refero di refero.design.
Tidak. Refero Styles tidak menyediakan cara untuk mengirim URL Anda sendiri: Anda memilih dari library-nya. Design Extractor membuat DESIGN.md dari URL publik apa pun saat Anda menjalankannya.
Tidak. Design Extractor menghasilkan satu file: DESIGN.md yang mengikuti spesifikasi Google, dengan token di front matter dan setiap komponen yang dipilihnya dari halaman sebagai resep berupa HTML dan CSS yang disaring. Agen coding Anda membacanya dan menulis style yang dipakai proyek Anda.
Setiap resep komponen dirender secara terpisah dan dibandingkan dengan situs live: pencocokan struktur bagian-bagiannya dengan yang diukur di halaman, dan perbandingan piksel dengan tangkapan baru dari elemen aslinya. Resep yang tidak lolos ditandai beserta alasannya, tidak pernah dikirim sebagai terverifikasi.
Sitemap style-nya mencantumkan 1.342 halaman style pada 2026-10-20.
Design Extractor bisa menjalankan ekstraksi dari negara lain. Setelah ekstraksi gagal karena hal itu, halaman hasil menawarkan pemilih negara, dengan negara tempat halaman itu bisa dimuat di urutan teratas, lalu menjalankan ekstraksi yang sama lewat browser di sana. Ekstraksi dari negara lain memakai harga Pro ditambah biaya tambahan 6 kredit (16 kredit). Jika ekstraksi gagal, kami mengembalikan kredit Anda.
Dapatkan DESIGN.md untuk situs yang Anda butuhkan
Tempel URL publik apa pun. Pro mengambil sampel halaman-halaman utama situs dan mengembalikan DESIGN.md yang sesuai spesifikasi dengan resep komponen yang dicek terhadap situs live.