Image to Code

• تصویر مرجع
• stack
• محدودیت UI
• جزئیات قابل حفظ

• کد قابل اجرا
• ساختار component
• نقاط تطبیق
• نکات mismatch

تصویر مرجع را به کد تبدیل کن. ورودی: image و stack. خروجی: پیاده‌سازی نزدیک و قابل توسعه.

1. تصویر مرجع را بده.
2. stack و محدودیت‌ها را مشخص کن.
3. از Skill بخواه بخش‌های اصلی را جدا کند.
4. کد را با طرح مرجع مقایسه کن.

برای یک mockup صفحه pricing، این Skill می‌تواند layout و componentهای اصلی را به JSX نزدیک کند.

• تصویر را بدون context به کد تبدیل می‌کنی.
• جزئیات مهم layout را جا می‌اندازی.
• خروجی را بدون تطبیق با responsive تست می‌کنی.

منبع اصلی و تأییدشده در skills.sh

npx skills add https://github.com/leonxlnx/taste-skill --skill image-to-code