Cursor
ورشة عمل دافئة لطباعة الرق، مضاءة بجمر متوهج
يستخدم Cursor نمطًا طباعيًا دافئًا يُشبه ورق البرشمان: خلفية كريمية، نص أسود داكن، ولمسة برتقالية نارية واحدة تُفعّل الروابط والاختيارات بدلًا من ملء الأزرار. العناوين، المكتوبة بخط CursorGothic بوزن 400، تتناقص فيها المسافات بين الأحرف تدريجيًا مع ازدياد حجمها - ويُضفي هذا النمط طابعًا رسميًا من خلال الرقة ووزن الأحرف الخفيف بدلًا من الجرأة. تبقى الأسطح مسطحة تُشبه الورق، مع حدود رفيعة وظلال رمادية ناعمة ودافئة؛ وتبقى الزوايا حادة بوزن 4 بكسل في جميع أنحاء النص. يُستخدم خط EB Garamond بشكل انتقائي للعناوين الفرعية والنصوص، بينما يتولى خط berkeleyMono معالجة التعليمات البرمجية والوسوم والبيانات الوصفية، مما يمنح النظام طابعًا طباعيًا أقرب إلى مجلة أدبية منه إلى لوحة تحكم SaaS.
أقصى عرض: ١٣٠٠ بكسل في المنتصف، هامش ٢٤ بكسل. شريط التنقل العلوي: رأس شفاف بارتفاع ٥٢ بكسل مع الشعار وعلامة نصية على اليسار، و٤ روابط تنقل في المنتصف، ومجموعة "تسجيل الدخول / اتصل بنا / تنزيل" محاذية لليمين. الصفحة الرئيسية: رأس محاذي لليسار + كتلة دعوة مزدوجة لاتخاذ إجراء مع نص يمتد من أعلى اليسار، ثم بطاقة نموذج منتج بعرض كامل تمتد على كامل عرض الصفحة. شريط الثقة: صف أفقي واحد من ٨ مربعات شعار في سطر واحد عبر عرض القسم. أقسام الميزات: يتناوب النص على اليسار ولقطة شاشة على اليمين في تخطيط من عمودين، كل منهما بنسبة ٥٠/٥٠، مع إيقاع رأسي من ٦٤ إلى ٩٦ بكسل بين الأقسام. جميع لقطات شاشة الميزات هي نماذج نوافذ بتصميم macOS متطابق. التذييل: شبكة من أربعة أعمدة من الروابط مع علامة العلامة التجارية على اليسار. يتم فصل الأقسام بمساحة كافية بدلاً من الفواصل - توفر اللوحة الكريمية نفسها الفصل.
تتصدر لقطات شاشة المنتج المشهد: نماذج كبيرة لنافذة macOS تعرض بيئة تطوير Cursor IDE أثناء العمل: علامات تبويب الملفات، وعرض المقارنات، وخطط الوكلاء، ولوحات الطرفية، وتكامل Slack/الدردشة. كل نموذج نافذة مؤطر ببطاقة #f2f1ed ذات تباين ناعم ودافئ. تمتد صورة منظر طبيعي هادئ (جبال/أفق صحراوي) خارج القسم الرئيسي، مضيفةً لمسة دافئة دون أن تتنافس مع واجهة المستخدم. تُعرض شعارات العملاء ( Stripe ، OpenAI، Linear، Datadog، NVIDIA، Figma، Ramp، Adobe) كحروف أحادية اللون داخل مربعات Linen بيضاوية الشكل. لا توجد صور لأشخاص، أو رسومات توضيحية، أو عناصر رسومية زخرفية مجردة - يتركز كل التركيز البصري على واجهة المستخدم وعلامة المنتج التجارية. الأيقونات عبارة عن رموز رفيعة أحادية الخط مملوءة بلون #7a7974 Ash، وليست ملونة.
لوحة الألوان
حيادي
- Ink
#26251e— النص الأساسي، وخلفية زر الإجراء الأساسي، ونص التنقل - لون دافئ، يكاد يكون أسود، وليس لونًا نقيًا #000 - Parchment
#f7f7f4— خلفية الصفحة، وهي اللوحة الرئيسية، عبارة عن لون كريمي دافئ يخفف التباين ويخلق إحساسًا بالطباعة بالحبر بدلاً من الطباعة الرقمية. - Bone
#f2f1ed— تخلق الأسطح الكرتونية والحاويات المرتفعة، ذات درجة لون أغمق من القماش، تأثيرًا متعدد الطبقات وبدون حدود يشبه "الورق على الورق". - Linen
#e6e5e0— لون محايد فاتح للأزرار على الأسطح الداكنة. - Stone
#cdcdc9— حدود رفيعة، فواصل، وتقسيمات دقيقة – خطوط بسمك 1 بكسل بألوان دافئة - Mist
#a1a19f— نص مساعد من المستوى الثالث، تعليقات توضيحية - بين النص الصامت والنص الثانوي.
الطباعة
من 12 إلى 72 بكسل · 6 خطوات
- CursorGothic — الاستبدال: Inter · الخطوط العريضة 400, 500 · الخط الأساسي لواجهة المستخدم، والعناوين، والتنقل، ومحتوى النص، وتصميم المنتج. تتميز العناوين بوزن 400 نقطة وتباعد أحرف متناقص تدريجيًا (-0.005em عند 22 بكسل ← -0.03em عند 72 بكسل)، حيث لا تظهر العناوين بخط عريض أبدًا. تُفعّل وظائف الخط ss08 وss09 وtnum البدائل الأسلوبية والجداول.
- EB Garamond — الاستبدال: Iowan Old Style · الخطوط العريضة 400, 500 · يُضفي خط CursorGothic، وهو خط serif تحريري للعناوين الفرعية الفردية ونص الجسم والبيانات الجدولية، لمسة أدبية على واجهة المستخدم.
- berkeleyMono — الاستبدال: ui-monospace · الخطوط العريضة 400, 500 · الخط أحادي المسافة - المستخدم في كتل التعليمات البرمجية، ومقتطفات سطر الأوامر، والبيانات الوصفية، ومسارات الملفات، وعلامات المطورين - هو لغة تقنية.
الفترات والشكل
| غاية | معنى |
|---|---|
| كثافة | كثيف |
| الخطوة الأساسية | 8px |
| نصف قطر الزر | 4px |
| نصف قطر البطاقة | 4px |
| الظلال | لا - حدود بدلاً من الظلال |
| بين الأقسام | 64-96px |
| عرض الصفحة | 1300px |
سيقوم الذكاء الاصطناعي ببناء موقعك الإلكتروني بأسلوب Cursor وتعبئته.
- املأ حسابك بالمنتجات والمنشورات عبر الرابط - Instagram ، TikTok ، Facebook.
- انقل المحتوى من موقعك القديم - ما عليك سوى تحديد العنوان.
- تصميم عصري على أفضل محرك: React ( Next.js) مع عرض الخادم وتحسين محركات البحث بشكل جاهز للاستخدام.
- تحسين محركات البحث المؤتمت بالكامل لنتائج البحث وتوصيات الشبكة العصبية.
أنماط مشابهة
- Amplemarket — مكان عمل غارق بأشعة الشمس ومغطى بالقصاصات الورقية الملونة
- Getharvest — مكتب في وقت الغروب – لوحة قماشية بلون كريمي دافئ، وبطاقات بريدية بيضاء معلقة على اللوحة، وشعلة برتقالية ساطعة واحدة
- Drive Capital — ملصق رحلة برية كلاسيكي مطبوع على ورق دافئ
- Wealthsimple — مستودع مبطن بالكشمير بإضاءة معرض فني
- Huddle — بطاقات جرد بألوان الباستيل على ورق كريمي
- Fuser — صور بولارويد متناثرة على جدار عمل مصمم
- Campsite — محطة عمل محرر مضاءة بأشعة الشمس - ورق كريمي دافئ مع ختم نية برتقالي واحد
- Redis Agency — ورشة التحرير، المفتوحة بعد ساعات العمل، هي مكان شديد الظلام حيث يتم إنجاز جميع أعمال العلامة التجارية باستخدام خطوط serif وفجل أحمر واحد.
- AI Product Generation — استوديو تصوير تحريري على ورق أبيض - العنوان كغلاف، واللون البرتقالي لإبراز المحتوى التحريري
- Getanchor — لون تيراكوتا دافئ على خلفية كريمية باهتة بفعل الشمس
- Flatfile — مفكرة بيانات هادئة على ورق دافئ
- Inthememory — رسم معماري على رخام أبيض بإضاءة دافئة واحدة. غرفة بيانات تحريرية هادئة، حيث يطفو حبر فيروزي داكن وأجهزة تحكم على شكل حبة دواء فوق أسطح بيضاء ناصعة، لا يقطعها سوى لمسة برتقالية واحدة.