- মাসিক ভিজিট
- 0
- মূল্য
- বিনামূল্যে
- তালিকাভুক্ত
- 2026-07-23
- আপডেট করা হয়েছে
- 2026-08-25
01pen.dev পরিচিতি
pen.dev হলো কোডিং পরিবেশে চলা একটি ডিজাইন ক্যানভাস। এতে ডেভেলপাররা পণ্যের ইন্টারফেস তৈরি করতে, পেজের প্রবাহ অনুসন্ধান করতে এবং ডিজাইন ও কোডের মধ্যে সংযোগ বজায় রাখতে পারেন। ডিজাইন ফাইলগুলো .pen ফরম্যাটে কোড রিপোজিটরিতে সংরক্ষিত থাকে, তাই Git ব্যবহার করে সংস্করণ, শাখা ও মার্জ পরিচালনা করা যায়। ডিজাইনকে HTML, CSS অথবা React-এও রূপান্তর করা যায়। এটি MCP-এর মাধ্যমে ক্যানভাস পড়া ও লেখার সুবিধাও দেয়।
02pen.dev-এর জন্য উপযুক্ত ব্যবহারকারী
ফ্রন্টএন্ড ডেভেলপার
IDE-এর ভেতরেই পেজ ও কম্পোনেন্ট ডিজাইন করে ফলাফলকে HTML, CSS অথবা React-এ রূপান্তর করুন এবং ডিজাইন টুল ও কোডিং পরিবেশের মধ্যে বারবার পরিবর্তনের প্রয়োজন কমান।
AI কোডিং টুল ব্যবহারকারী ডেভেলপার
Cursor, VSCode, Claude Code অথবা OpenAI Codex-এর মাধ্যমে ক্যানভাসের সুবিধা ব্যবহার করে ইন্টারফেস তৈরি করুন বা একই সঙ্গে একাধিক পেজের দিক অনুসন্ধান করুন।
ডিজাইন সিস্টেম থাকা ডেভেলপমেন্ট টিম
কোডবেসের বিদ্যমান ডিজাইন সিস্টেম ক্যানভাসে সংযুক্ত করে কম্পোনেন্টভিত্তিক ডিজাইন কিট দিয়ে ইন্টারফেস তৈরি করুন এবং ডিজাইন ও বাস্তবায়নের সামঞ্জস্য বজায় রাখুন।
03pen.dev-এর প্রধান ফিচার
সীমাহীন ডিজাইন ক্যানভাস
IDE-এর ভেতর পণ্যের ইন্টারফেস তৈরি ও সমন্বয় করুন। এতে পিক্সেল-স্তরের অবস্থান নির্ধারণ সমর্থিত, ফলে ডিজাইন ও কোড সবসময় পাশাপাশি কর্মপরিবেশে থাকে।
AI-নির্মিত পেজ ও প্রবাহ
প্রম্পটের মাধ্যমে সম্পূর্ণ পেজ বা পুরো ইন্টারফেস প্রবাহ তৈরি করুন। একাধিক AI সহকারীকে একই সঙ্গে বিভিন্ন ডিজাইনের দিক অনুসন্ধান করাতেও পারেন।
প্রাসঙ্গিক ডিজাইন অপারেশন
সম্পূর্ণ স্ক্রিন বা নির্দিষ্ট অংশের জন্য প্রয়োজন জানিয়ে প্রিসেট অপারেশনের মাধ্যমে দ্রুত পরিবর্তন করুন। চাইলে শুরু থেকে কাস্টম অপারেশনও লিখতে পারেন।
ডিজাইন থেকে ফ্রন্টএন্ড কোড
ক্যানভাসের ডিজাইনকে HTML, CSS অথবা React-এ রূপান্তর করে ডেভেলপারদের ভিজ্যুয়াল পরিকল্পনাকে ব্যবহারযোগ্য অ্যাপ্লিকেশন বাস্তবায়নে এগিয়ে নিতে সহায়তা করুন।
ডিজাইন ফাইলের সংস্করণ ব্যবস্থাপনা
.pen ফাইলে ডিজাইনের বিষয়বস্তু সংরক্ষণ করে কোড রিপোজিটরিতে রাখুন। ডেভেলপমেন্ট কোডের মতো Git ব্যবহার করে সংস্করণ, শাখা ও মার্জ পরিচালনা করুন।
Figma ডিজাইন আমদানি
Figma ডিজাইন সরাসরি কপি ও পেস্ট করে এর ভেক্টর, টেক্সট এবং স্টাইল pen.dev-এ এনে সম্পাদনা চালিয়ে যান।
MCP দ্বিমুখী ক্যানভাস অপারেশন
MCP-এর মাধ্যমে ডিজাইন ক্যানভাস পড়ুন ও লিখুন এবং ডেটাবেস, API, চার্ট ডেটা অথবা Playwright, Puppeteer-এর মতো বাহ্যিক উৎস সংযুক্ত করুন।
04pen.dev-এর বিশেষ বৈশিষ্ট্য
ডিজাইন ফাইল কোড রিপোজিটরিতে থাকে
ডিজাইনকে আলাদা কোনো টুলে বিচ্ছিন্ন রাখা হয় না; এটি ফাইল হিসেবে প্রকল্পের রিপোজিটরিতে সংরক্ষিত থাকে এবং কোডের সঙ্গে একসঙ্গে সংস্করণ ব্যবস্থাপনা করা যায়।
উন্মুক্ত ফাইল ফরম্যাট
ডিজাইন ফাইল পড়া, ডিবাগ ও সম্প্রসারণ করা যায়। অফিসিয়ালভাবে ব্ল্যাক-বক্স ফরম্যাট ব্যবহার না করার ওপর জোর দেওয়া হয়েছে, তাই ডেভেলপাররা নিজেদের টুল দিয়ে ফাইল প্রক্রিয়া করতে পারেন।
দ্বিমুখী MCP সক্ষমতা
ক্যানভাসের তথ্য পড়ার পাশাপাশি সম্পূর্ণ লেখার অনুমতিও দেওয়া হয়, ফলে বাহ্যিক MCP, ডেটা উৎস এবং অন্যান্য এজেন্ট ক্যানভাস অপারেশনে অংশ নিতে পারে।
ডিজাইন ও কোড একই স্ক্রিনে
পিক্সেল-স্তরের ডিজাইন ক্যানভাসকে কোডিং পরিবেশে নিয়ে এসে ডেভেলপারদের ডিজাইন ও বাস্তবায়নের মধ্যে দ্রুত পরিবর্তন করতে সহায়তা করুন এবং প্রচলিত ডিজাইন হস্তান্তরের ধাপ কমান।
05তথ্যের উৎস
© দাবিত্যাগ: সময়ের সঙ্গে ডোমেইন ও লিংক করা কনটেন্ট পরিবর্তিত হতে পারে। AIEZZ তৃতীয় পক্ষের ওয়েবসাইট নিয়ন্ত্রণ করে না। বাহ্যিক কনটেন্ট ও ঝুঁকি স্বাধীনভাবে পর্যালোচনা করুন।



ব্যবহারকারীর রিভিউ0