Μία προδιαγραφή. Κάθε εργαλείο κώδικα AI. Χωρίς δέσμευση.

Αντιγράψτε οποιοδήποτε σχέδιο ιστοσελίδας σε μια προδιαγραφή κατασκευής AI.

Paste a URL and we copy any website design into a μηχανική προδιαγραφή 6.000 λέξεων. Drop it into Claude Code, Codex, Cursor, or Gemini and get 90% έτοιμο στην πρώτη προτροπή.

TailwindMotionshadcn/uiThree.jsGSAPWebGLReactNext.js

Οποιοδήποτε ενεργό site — προσθέτουμε https:// αν λείπει. Πατήστε Enter για δημιουργία.

Δωρεάν λογαριασμός — 1 spec συμπεριλαμβάνεται, χωρίς κάρτα, ένας λογαριασμός ανά άτομο.

Δοκιμάστε ένα παράδειγμα:

Κύλιση

Λειτουργεί με κάθε εργαλείο κώδικα AI που ήδη χρησιμοποιείτε.

Claude Code
Claude Design
Codex
Gemini
Cursor
Windsurf
Replit
ChatGPT
v0
Bolt
Copilot
Lovable
Claude Code
Claude Design
Codex
Gemini
Cursor
Windsurf
Replit
ChatGPT
v0
Bolt
Copilot
Lovable

Κυκλοφορεί σύντομα δημόσια

Γιατί τα στιγμιότυπα οθόνης αποτυγχάνουν


Ένα στιγμιότυπο οθόνης δίνει στην AI σας ένα jpeg και μια προσευχή. Αυτή παραισθάνεται τη γραμματοσειρά, επινοεί την απόσταση και επιλέγει τη λάθος βιβλιοθήκη στοιχείων. Εμείς της δίνουμε τα πραγματικά δεδομένα.

Η προσέγγιση με στιγμιότυπο οθόνηςscreenshot.png → llm → guesswork

Δεσμευμένοι, στα τυφλά

Τα Bolt, Lovable, v0 σας παγιδεύουν στον επεξεργαστή τους και παραισθάνονται ό,τι δεν μπορεί να δείξει το στιγμιότυπο οθόνης. Ξοδεύετε τρεις ώρες διορθώνοντας αυτό που θα είχε αποτρέψει μια καλή προδιαγραφή.

  • Οι κινούμενες εικόνες χάθηκαν. Το στιγμιότυπο οθόνης είναι ένα παγωμένο καρέ.
  • Γραμματοσειρές μαντεμένες. Συνήθως καταλήγει σε system-ui.
  • Χρώματα εκτιμημένα. Απόκλιση HSL, λάθος αδιαφάνεια.
  • Αποκριτική διάταξη επινοημένη. Συνήθως λάθος.
  • Βιβλιοθήκη στοιχείων: ό,τι θέλει το LLM.
  • Άγνωστη τεχνολογική στοίβα. Η έξοδος είναι μη στυλιζαρισμένα divs.
  • Εφέ κύλισης, καταστάσεις αιώρησης, αλληλεπιδράσεις: παραλείφθηκαν.
  • Αόριστη προτροπή, αόριστος κώδικας.
CopyDesign.aiurl → spec → any AI tool

Φορητό. Ακριβές. Δικό σας.

Απλό markdown. Επικολλήστε το σε οποιοδήποτε εργαλείο AI για το οποίο ήδη πληρώνετε. Ανιχνεύουμε την ζωντανή σελίδα, αναλύουμε το DOM, αποδίδουμε τις καταστάσεις κύλισης, εξάγουμε το γράφημα CSS και παράγουμε μια προδιαγραφή με αρκετό σήμα ώστε η AI σας να μην χρειάζεται να μαντέψει.

  • Καμπύλες cubic-bezier, διάρκειες, καθυστερήσεις — όλα χαρτογραφημένα.
  • Ακριβής οικογένεια γραμματοσειράς, βάρος, μέγεθος, ύψος γραμμής.
  • Χρώματα ακριβείας hex, σημεία διαβάθμισης, μεταβλητές CSS.
  • Κάθε σημείο διακοπής, κατάρρευση στήλης, βήμα γραμματοσειράς.
  • Αναγνωρίζει shadcn / Radix / MUI / Tailwind.
  • Ανιχνεύει Next.js, Astro, Vite, Motion, GSAP.
  • Οι ενεργοποιήσεις κύλισης και οι καταστάσεις αιώρησης τεκμηριώνονται.
  • Προδιαγραφή 6.000+ λέξεων που η AI σας μπορεί πραγματικά να ακολουθήσει.

Η AI σας είναι τόσο καλή όσο το πλαίσιο που της δίνετε. Δώστε της μια προδιαγραφή, όχι ένα στιγμιότυπο οθόνης.

Η διαδικασία μας

Χωρίς εξερεύνηση DevTools. Χωρίς επιλογή χρωμάτων. Χωρίς καταγραφή τιμών padding στην κονσόλα. Επεξεργαζόμαστε τον ιστότοπο μέσω έξι περασμάτων εξαγωγής και σας παραδίδουμε την πηγή της αλήθειας σε λιγότερο από 45 δευτερόλεπτα.

ΕΙΣΑΓΩΓΉ

Ανάκτηση του ζωντανού ιστότοπου

Το Headless Chromium αποδίδει την πραγματική σελίδα — JS αξιολογείται, γραμματοσειρές ιστού φορτώνονται, καταστάσεις κύλισης καταγράφονται, κλήσεις δικτύου καταγράφονται. Χωρίς παλιό στιγμιότυπο οθόνης, χωρίς εικασίες από την προβολή πηγής.

ΕΞΑΓΩΓΉ

Εξαγωγή της αλήθειας του DOM

Διαβάζουμε το υπολογισμένο CSS σε κάθε στοιχείο — ακριβή χρώματα hex, οικογένεια γραμματοσειράς, ύψος γραμμής, padding, border-radius, σκιά. Επιπλέον το ακατέργαστο κείμενο ώστε η AI να αναπαράγει κείμενο αντί να το παραισθάνεται.

ΔΕΊΤΕ

Οπτική ανάλυση δύο περασμάτων

Ένα πρωτοποριακό μοντέλο όρασης διαβάζει τα στιγμιότυπα οθόνης. Το πρώτο πέρασμα χαρτογραφεί τη διάταξη, την ιεραρχία και τη δομή των στοιχείων. Το δεύτερο πέρασμα καταγράφει κινούμενες εικόνες, καταστάσεις αιώρησης και κίνηση που ενεργοποιείται με κύλιση.

ΑΝΑΓΝΏΡΙΣΗ

Αναγνώριση της στοίβας

Ανιχνεύουμε Next.js, Astro, Vite, Tailwind, shadcn/ui, Radix, Framer Motion, GSAP — από μοτίβα DOM και καθολικές μεταβλητές χρόνου εκτέλεσης. Η έξοδος στοχεύει στην ίδια στοίβα ώστε η AI σας να δημιουργεί κώδικα εγγενούς μορφής.

ΣΎΝΘΕΣΗ

Σύνθεση της προδιαγραφής

Τα ευρήματα DOM + οπτικά ευρήματα + αναγνώριση στοίβας συγχωνεύονται σε μια δομημένη μηχανική περίληψη 6.000 λέξεων — design tokens, πλέγμα διάταξης, χρονισμοί κίνησης, αποκριτικά σημεία διακοπής, σειρά κατασκευής.

ΑΠΟΣΤΟΛΉ

Επικόλληση σε οποιοδήποτε εργαλείο AI

Απλό κείμενο εξόδου — λειτουργεί σε Claude Code, Cursor, Codex, Windsurf, v0, Bolt, Lovable, ChatGPT. Χωρίς δέσμευση προμηθευτή. Σας ανήκει η προδιαγραφή για πάντα, ακόμα κι αν ακυρώσετε.

Τι λαμβάνετε

Κάθε εκτέλεση παράγει ένα δομημένο προσχέδιο 6.000+ λέξεων. Επικολλήστε το σε Claude Code, Cursor ή Codex και λάβετε μια λειτουργική υλοποίηση — όχι μια παραισθητική προσέγγιση.

clone-prompt.md
# CLONE SPECIFICATION
# source · linear.app

## TECH STACK DETECTED
  framework     Next.js 14 (App Router)
  styling       Tailwind CSS + CSS vars
  components    Custom primitives + Radix
  animation     Framer Motion
  font loader   next/font · "Inter Tight"

## DESIGN TOKENS → colors
  --background  #08090A
  --foreground  #F7F8F8
  --accent      #5E6AD2
  --muted       #858699
  --border      rgba(255,255,255,0.08)

## TYPOGRAPHY
  font-family   "Inter Tight", -apple-system
  scale         12 / 14 / 16 / 20 / 28 / 40 / 64
  line-height   1.1 headings · 1.5 body
  tracking      -0.022em headings

## LAYOUT ARCHITECTURE
  hero          12-col grid · 1200px max · centered
  nav           sticky · backdrop-blur(24px) · 64h
  section       96px vertical rhythm
  cards         4px radius · inset 1px 0 rgba(...)

## ANIMATION SPECS
  hero.enter    opacity 0→1, y 20→0, 600ms ease-out
  scroll.reveal IntersectionObserver · margin -80px
  hover.default scale(1.02) · 250ms cubic-bezier(.2,.8,.2,1)

## RESPONSIVE
  ≤ 640px       single column · 16px padding
  ≤ 1024px      2-col grid · 24px padding
  ≥ 1024px      3-col grid · 48px padding

## BUILD INSTRUCTIONS
Build in Next.js 14 (App Router). Use Tailwind with
Αντιγραφή. Επικόλληση στο εργαλείο AI σας. Αποστολή.

Τεχνολογική στοίβα

Ανιχνεύεται από κεφαλίδες, υπογραφές σεναρίων και μοτίβα DOM. Next.js / Astro / Vite / Remix — με εκδόσεις όπου εκτίθενται.

Design tokens

Τιμές Hex, προσαρμοσμένες ιδιότητες CSS, κλίμακα απόστασης, μετρικά γραμματοσειράς, border-radius, ορισμοί σκιάς — κάθε μεταβλητή που έχει σημασία.

Συμπεριφορά

καμπύλες easing, ενεργοποιήσεις κύλισης, μεταβάσεις αιώρησης, αλλαγές σημείων διακοπής. Το 40% του σχεδιασμού που ένα στιγμιότυπο οθόνης δεν μπορεί να καταγράψει.

Τι εξάγουμε

Το σήμα που διαχωρίζει μια ολοκληρωμένη κατασκευή από ένα πρόχειρο αντίγραφο — καμπύλες easing, υπολογισμένα tokens, η πραγματική βιβλιοθήκη στοιχείων. Το αντλούμε από τη ζωντανή σελίδα, όχι από μια εικόνα.

Εξαγωγή Διάταξης & Απόστασης

Διαβάζει υπολογισμένα μοντέλα πλαισίου, ορισμούς πλέγματος, τιμές κενού, padding και οπτική ιεραρχία από το ζωντανό DOM — όχι μια εικασία από ένα στιγμιότυπο οθόνης.

Ακριβές Χρώμα & Τύπος

Αντλεί τιμές hex, σημεία διαβάθμισης, προσαρμοσμένες ιδιότητες CSS, οικογένειες γραμματοσειρών, βάρη, μεγέθη και υπολογισμένα ύψη γραμμής απευθείας από το δέντρο απόδοσης.

Ανίχνευση Βιβλιοθήκης Στοιχείων

Αναγνωρίζει μοτίβα shadcn/ui, Radix, MUI, Headless UI και Tailwind — ώστε η προδιαγραφή να λέει στην AI σας ποιες πρωτόγονες να χρησιμοποιήσει.

Καμπύλες & Ενεργοποιήσεις Κίνησης

Καταγράφει συναρτήσεις easing, διάρκειες, εφέ που συνδέονται με κύλιση και μεταβάσεις αιώρησης — και στη συνέχεια τα γράφει ως προδιαγραφές Motion/GSAP που η AI σας μπορεί να υλοποιήσει.

Πλήρης Αναγνώριση Στοίβας

Ανιχνεύει Next.js, Vite, Astro, Remix, σενάρια ανάλυσης, υπογραφές CDN και ενσωματώσεις τρίτων. Ακριβείς εκδόσεις όταν οι κεφαλίδες τις εκθέτουν.

Χάρτης Αποκριτικών Σημείων Διακοπής

Τεκμηριώνει κάθε σημείο διακοπής, εναλλαγή flex/grid, κατάρρευση στήλης και βήμα μεγέθους γραμματοσειράς — ώστε η διάταξη για κινητά να μην είναι μια εκ των υστέρων σκέψη στην προδιαγραφή.

Υπεύθυνη χρήση

Έμπνευση, όχι παραβίαση.

Το CopyDesign.ai είναι ένα εργαλείο μελέτης και πρωτοτυποποίησης. Χρησιμοποιήστε το για να κατανοήσετε μοτίβα σχεδιασμού, να εξαγάγετε μεμονωμένα στοιχεία και να επιταχύνετε τη δική σας πρωτότυπη εργασία. Δεν υποστηρίζουμε κακόβουλη χρήση — καμία πλαστοπροσωπία επωνυμίας, καμία σελίδα phishing, καμία παραβίαση εμπορικού σήματος ή πνευματικών δικαιωμάτων. Αλλάξτε το λογότυπο, το όνομα, το κείμενο. Κάντε το δικό σας.

Γιατί CopyDesign.ai

Εμείς γράφουμε την προδιαγραφή. Η AI σας κάνει την κατασκευή.

Απλή έξοδος markdown. Λειτουργεί με Bolt, Lovable, v0, Cursor, Claude Code, Codex — επιλογή σας.

Καμία δέσμευση εργαλείου. Ποτέ.

Η προδιαγραφή είναι απλό κείμενο. Επικολλήστε το σε Claude Code σήμερα, Codex αύριο, Gemini την επόμενη εβδομάδα.

$1.99. Μία προδιαγραφή. Δεν απαιτείται συνδρομή.

Δοκιμάστε το πριν δεσμευτείτε. Αγορά μιας χρήσης, άμεση έξοδος.

90% έτοιμο στην πρώτη προτροπή. Ειλικρινά.

Δεν υποσχόμαστε τέλεια ακρίβεια pixel. Υποσχόμαστε αρκετό σήμα ώστε η AI σας να μην μαντεύει.

6.000 λέξεις δομημένου σήματος, όχι μια αόριστη περιγραφή.

Τεχνολογική στοίβα, design tokens, προδιαγραφές κίνησης, αποκριτική λογική — όλα σε μία επικόλληση.

Η URL είναι η προτροπή. Σταματήστε τα στιγμιότυπα οθόνης.

Δώστε στην AI σας τα δεδομένα που χρειάζεται αντί για μια εικόνα που πρέπει να ερμηνεύσει.

Μελετήστε την τέχνη. Δημιουργήστε κάτι πρωτότυπο.

Έμπνευση, όχι παραβίαση. Εμείς εξάγουμε μοτίβα — εσείς φέρνετε την ιδέα.

Τιμολόγηση

Δοκιμάστε το μία φορά, δωρεάν, χωρίς να απαιτείται κάρτα. Αναβαθμίστε όταν η έξοδος μιλήσει από μόνη της — χωρίς δοκιμές, χωρίς επιστροφές χρημάτων.

Δωρεάν

$0/μήνα

1 κλωνοποίηση · για πάντα

Πιο δημοφιλές

Starter

$9.99/μήνα

12 κλωνοποιήσεις / μήνα

Pro

$19.99/μήνα

30 κλωνοποιήσεις / μήνα

Συχνές Ερωτήσεις

Ερωτήσεις, απαντήσεις.

Ευθείες απαντήσεις για το τι κάνει το CopyDesign.ai και τι δεν κάνει.

Λειτουργεί σε εφαρμογές πίσω από τείχη σύνδεσης;
Όχι. Ανακτούμε και λαμβάνουμε στιγμιότυπα οθόνης μόνο από τη δημόσια URL. Πίνακες ελέγχου, πίνακες διαχείρισης και ροές με έλεγχο ταυτότητας είναι εκτός εμβέλειας. Για αυτά, μεταβείτε σε λειτουργία Εικόνας ή Κινητού — τραβήξτε τα στιγμιότυπα οθόνης μόνοι σας και ανεβάστε τα.
Μπορεί να χειριστεί ιστότοπους CSS-in-JS όπως το Linear ή το Stripe;
Ναι. Διαβάζουμε υπολογισμένα στυλ αφού αποδοθεί η σελίδα, όχι το πηγαίο JS. Το Stripe και το Linear είναι δύο από τις εξόδους μας με την υψηλότερη πιστότητα — το CSS-in-JS δεν αποτελεί πρόβλημα.
Τι γίνεται με ιστότοπους με WebGL ή βαριά χρήση canvas;
Εν μέρει. Η στατική διάταξη, η τυπογραφία και το UI chrome εξάγονται καθαρά. Οι WebGL shaders και οι σκηνές Three.js προσεγγίζονται — περιγράφουμε το εφέ και παρέχουμε μια υλοποίηση placeholder. Η πλήρης αναπαραγωγή shader δεν είναι στον οδικό χάρτη.
Αποθηκεύεται η URL μου κάπου;
Η URL σας αποθηκεύεται στο ιστορικό κλωνοποιήσεών σας, ορατή στον πίνακα ελέγχου σας. Δεν την πουλάμε ούτε τη μοιραζόμαστε. Τα στιγμιότυπα οθόνης που λαμβάνονται κατά την ανάλυση απορρίπτονται μόλις δημιουργηθεί η προδιαγραφή. Δείτε την πολιτική απορρήτου για την πλήρη εικόνα.
Τι θεωρείται μία 'κλωνοποίηση' — κοστίζουν επιπλέον οι επανεκτελέσεις;
Κάθε κλικ στο 'Δημιουργία' κοστίζει μία πίστωση, συμπεριλαμβανομένων των επανεκτελέσεων της ίδιας URL. Τα αποτελέσματα δεν αποθηκεύονται στην κρυφή μνήμη μεταξύ των συνεδριών, οπότε μια επανεκτέλεση παράγει μια νέα προδιαγραφή και αφαιρεί μία πίστωση.
Πόσο χρόνο χρειάζεται μια τυπική κλωνοποίηση;
Λειτουργία URL: 20–45 δευτερόλεπτα. Λειτουργία εικόνας και στιγμιότυπου οθόνης κινητού: 10–20 δευτερόλεπτα (χωρίς βήμα ανάκτησης). Λειτουργία βίντεο: 60–90 δευτερόλεπτα ανάλογα με το μέγεθος αρχείου. Οι σελίδες με βαριά χρήση JS χρειάζονται περισσότερο χρόνο επειδή περιμένουμε την πλήρη απόδοση.
Μπορώ να κλωνοποιήσω εφαρμογές κινητών από στιγμιότυπα οθόνης;
Ναι — αυτή είναι η λειτουργία Mobile App. Ανεβάστε έως και 10 στιγμιότυπα οθόνης από οποιαδήποτε εφαρμογή iOS ή Android και λάβετε μια πλήρη προδιαγραφή με οδηγίες στοιχείων React Native και SwiftUI. Περισσότερες οθόνες σημαίνουν πιο ολοκληρωμένη έξοδο.
Με ποια εργαλεία AI λειτουργεί η έξοδος;
Η προδιαγραφή είναι απλό κείμενο. Επικολλήστε το σε Claude Code, Codex, Gemini, Cursor, Windsurf, Replit, v0, Bolt ή ChatGPT. Είναι μορφοποιημένο για Next.js + Tailwind από προεπιλογή, αλλά αρκετά ευανάγνωστο για να προσαρμοστεί σε οποιαδήποτε στοίβα.

Δώστε στην AI σας μια προδιαγραφή.
Όχι ένα στιγμιότυπο οθόνης για να ατενίζετε.

Μία URL. Σε λιγότερο από 45 δευτερόλεπτα. Μια προδιαγραφή 6.000 λέξεων από την οποία η AI σας μπορεί πραγματικά να χτίσει. Η πρώτη είναι δωρεάν — χωρίς κάρτα, χωρίς λίστα αναμονής.

Δείτε την τιμολόγηση

Χωρίς κάρτα · Ακύρωση ανά πάσα στιγμή · Έξοδος σε λιγότερο από 45 δευτερόλεπτα