أهلاً وسهلاً بكم في مختبر wowolabs للإبداع والأكواد والتجارب الرقمية.

إلى عشاق القهوة والبرمجة: الفكرة الصغيرة قد تتحول إلى مشروع كبير.

إلى كل مبدع: اترك بصمتك، فالأفكار الجميلة تستحق أن تُرى.

رسالة اليوم: النجاح ليس صدفة؛ إنه مجموعة محاولات لم تتوقف.








🪑 Imperial Throne SVG | عرش إمبراطوري

🪑 Imperial Throne SVG | عرش إمبراطوري

01ما هو Imperial Throne SVG؟

Imperial Throne SVG هو عنصر SVG تفاعلي بتصميم عرش ملكي بنفسجي، يجمع بين الشكل البصري والحركة الخفيفة داخل الصفحة. ويمكن استخدامه داخل مشاريع HTML أو صفحات الشرح والعروض التقنية.

وإذا كنت تجمع عناصر ملكية من نفس النمط، يمكنك مشاهدة Crystal Ball SVG | الكرة البلورية الملكية كعنصر بصري مكمل لنفس الهوية.

02أبرز فوائد Imperial Throne SVG

  1. خفيف الوزن: يعتمد على SVG بدل صورة كبيرة.
  2. قابل للتخصيص: يمكن تغيير الألوان والتدرجات بسهولة.
  3. متحرك: يحتوي على تأثير الطفو والتألق الموجود في الكود الأصلي.
  4. جاهز للاستخدام: يمكن نسخ SVG وإضافته إلى مشروع HTML.

03كيف تستخدم العرش الملكي؟

  1. للمطورين: أضف الكود إلى موقعك أو تطبيقك كعنصر بصري ملكي.
  2. للمصممين: استخدمه في النماذج الأولية أو القوالب الفاخرة.
  3. لصانعي المحتوى: استخدمه كعرض تفاعلي داخل الشروحات التقنية.

04طريقة تضمين SVG

انسخ SVG النقي وضعه داخل مشروع HTML. ويمكن تعديل ألوان التدرجات البنفسجية أو سرعة الحركة من خلال CSS.

ولمشاهدة عنصر متحرك آخر من نفس المجموعة، راجع Royal Phoenix | العنقاء الملكية.

05كود SVG النقي

CODE
<svg viewBox="0 0 100 100"> <defs> <linearGradient id="throneGrad" x1="0%" y1="0%" x2="100%" y2="100%"> <stop offset="0%" stop-color="#9B59B6"/> <stop offset="50%" stop-color="#6A0DAD"/> <stop offset="100%" stop-color="#4B0082"/> </linearGradient> <filter id="throneGlow"> <feGaussianBlur stdDeviation="3" result="blur"/> <feMerge> <feMergeNode in="blur"/> <feMergeNode in="SourceGraphic"/> </feMerge> </filter> </defs> <path d="M30 30 L30 80 L25 85 L25 90 L75 90 L75 85 L70 80 L70 30 Q70 20 50 20 Q30 20 30 30" fill="url(#throneGrad)" stroke="#BB8FCE" stroke-width="2" filter="url(#throneGlow)"/> <rect x="35" y="35" width="30" height="40" fill="#4B0082" opacity="0.8" rx="5"/> <path d="M30 30 Q50 25 70 30" stroke="#BB8FCE" stroke-width="3" fill="none"/> <circle cx="50" cy="25" r="5" fill="#BB8FCE" filter="url(#throneGlow)"/> <rect x="40" y="80" width="5" height="10" fill="#6A0DAD"/> <rect x="55" y="80" width="5" height="10" fill="#6A0DAD"/> </svg>

06كيف تعمل ألوان العرش؟

يعتمد التصميم الأصلي على linearGradient لتكوين التدرج البنفسجي بين درجات #9B59B6 و#6A0DAD و#4B0082، مع حدود بلون #BB8FCE.

يمكن تغيير هذه القيم مباشرة للحصول على نسخة مختلفة من العرش مع الحفاظ على نفس بنية SVG.

07كيف تعمل حركة Imperial Throne؟

الكود الأصلي يستخدم حركتين: throneFloat لتحريك العرش رأسيًا بحركة طفو هادئة، وthroneShimmer لتغيير السطوع وتأثير الظل أثناء الحركة.

08أين يمكن استخدام Imperial Throne SVG؟

  1. واجهات المواقع والمشاريع الرقمية.
  2. الشروحات التقنية التي تحتاج مثال SVG متحرك.
  3. التصاميم الملكية والفانتازية.
  4. النماذج الأولية والقوالب البصرية.

ومن نفس المجموعة الملكية يمكنك مشاهدة Royal Chalice SVG | الكأس الملكي.

09هل يمكن تعديل حجم العرش؟

نعم. لأن العنصر مبني بصيغة SVG، يمكن تغيير عرضه وارتفاعه من CSS مع الحفاظ على شكل الرسم ونسبه الأساسية من خلال viewBox.

10نصائح عند استخدام SVG داخل HTML

  1. حافظ على قيمة viewBox الموجودة في SVG.
  2. تأكد من عدم حذف تعريفات التدرج والفلاتر المستخدمة داخل الرسم.
  3. عدّل الألوان من قيم stop-color بدل تغيير بنية الرسم كاملة.
  4. راجع إغلاق وسوم SVG بعد أي تعديل يدوي.
أسئلة شائعة

01هل يمكن تغيير ألوان Imperial Throne SVG؟

نعم، يمكن تعديل ألوان التدرج البنفسجي من قيم stop-color داخل linearGradient.

02هل يمكن استخدام العرش داخل HTML؟

نعم، الكود الموجود في المقال عبارة عن SVG يمكن تضمينه مباشرة داخل مشروع HTML.

03هل يمكن تعديل حركة العرش؟

نعم، يمكن تعديل مدة throneFloat وthroneShimmer من CSS لتغيير سرعة الحركة.

مواضيع ذات صلة
وعد الشيمي

CREATOR / WOWOLABS

وعد الشيمي ✓

مصممة واجهات وتجارب المستخدم ومطورة محتوى رقمي. أحول الأفكار إلى واجهات وأدوات وتجارب ويب تجمع بين الجمال والوظيفة.

التعليقات

ملحوظة: يمكن لأعضاء المدونة فقط إرسال تعليق.

مشاركة مميزة

برومبت تحويل الصورة إلى رسم رصاص واقعي داخل دفتر سكتش

برومبت تحويل الصورة إلى رسم رصاص واقعي داخل دفتر سكتش مع الحفاظ على ملامح الوجه برومبت جاهزًا للنسخ، وليست أداة مباشرة لتوليد الصور. يمكنك استخدام المطالبة داخل Gemini أو ChatGPT أو أي منصة تدعم إنشاء الصور وتعديلها بالذكاء الاصطناعي، بهدف تحويل الصورة الشخصية إلى رسم رصاص واقعي داخل دفتر سكتش مع الاحتفاظ بتفاصيل الوجه الأصلية. محتويات المقال 01 مقدمة عن برومبت الرسم بالرصاص الواقعي 02 ما الفكرة التي ينفذها هذا البرومبت؟ 03 خطوات استخدام برومبت الرسم داخل دفتر سكتش 04 برومبت وصف ملامح الوجه والرسم بالرصاص 05 قالب عام للحفاظ على ملامح الشخص 06 نسخة محسنة للحصول على نتيجة أكثر واقعية 07 ما الفرق بين البرومبت الأول والقالب العام؟ 08 نصائح للحصول على رسم رصاص أكثر دقة 09 أخطاء شائعة عند إنشاء صور الرسم بالرصاص 10 استخدامات الصور الناتجة 11 أمثلة على النتائج المتوقعة 12 الأسئلة الشائعة 13 الخلاصة 01 مقدمة عن برومبت ...

تحميل ملصقات واتساب أعياد ميلاد بالأسماء مجاناً

تحميل ملصقات أسماء أعياد الميلاد مجانًا من WOWOLabs يسعد صباحكم ومساءكم بكل خير يا زوار وأعضاء مدونة WOWOLabs الحلوين 👉 اليوم صممت لكم ملصقات أسماء تجنن لأعياد الميلاد، تنفع كملصقات للويب، وبوسترات طباعية، وبنرات إعلانية، وحالات واتساب، وتصاميم سوشيال ميديا الملصقات مصممة بجودة عالية جدًا، وحصرية، وما راح تحصلونها بنفس الشكل في مكان ثاني، لأنها من تصميمي وعمل يدي. والأحلى من كذا، أي شخص يعجبه هذا النمط ويحب أسوي له تصميم بنفس الأسلوب، سواء باسم عربي أو إنجليزي، يكتب الاسم في التعليقات وبإذن الله أسويه له. فوائد ملصقات أسماء أعياد الميلاد توفير الوقت في تصميم بطاقات التهنئة. إضافة لمسة شخصية باسم صاحب المناسبة. مناسبة للاستخدام في السوشيال ميديا والطباعة. تصلح للهدايا الرقمية والمفاجآت البسيطة. تعطي التصميم شكلًا احتفاليًا جاهزًا بدون برامج معقدة. مميزات هذه المجموعة تصاميم حصرية من WOWOLabs. مناسبة للأسماء العربية والإنجليزية. تصلح للبوسترات والبنرات والملصقات. جودة واضحة ومناسبة للاستخدام الرقمي. إمكانية طلب أسماء جديدة من خلال التعليقات. استخدامات ا...

ملصقات حروف زخرفية و نباتية مجانية

حروف نباتية زخرفية PNG بخلفية شفافة تحميل حروف بخلفية شفافة بتصميم نباتي أنيق يجمع بين جمال الحروف الزخرفية والأوراق الخضراء والطحالب والزهور الصغيرة. ☷ محتويات المقال 01 ما هي الحروف النباتية المزخرفة؟ 02 مميزات التصميم 03 استخدامات الحروف 04 معاينة وتحميل الملصقات 05 طريقة التحميل 06 الخلاصة 01 ما هي الحروف النباتية المزخرفة؟ هي حروف PNG بخلفية شفافة بتصميم طبيعي مميز، تجمع بين الحروف الزخرفية والعناصر النباتية مثل الأوراق الخضراء والطحالب والزهور الصغيرة. 02 مميزات التصميم خلفية PNG شفافة. جودة عالية مناسبة للتصميم والطباعة. عناصر نباتية وزخارف طبيعية واقعية. مناسبة للشعارات والعناوين والهوية البصرية. سهلة الاستخدام في برامج التصميم المختلفة. 03 استخدامات الحروف تصميم الشعارات. أسماء العلامات التجارية. بطاقات الدعوات. منشورات وسائل التواصل الاجتماعي. مواقع الويب والمدونات. المشاريع التعليمية والفنية. ولتصميمات زهرية أخرى يمكنك مشاهدة ملصقات حروف النيون الفانتزية مجانية PNG و ملصقات حروف بتلات PNG مجانية . 04 معاينة وتحميل الملصقات وضعت كل ملصق د...

ملصقات فانتازية ثلاثية الأبعاد بصيغة PNG

PNG بخلفية شفافة ملصقات حروف النيون الفانتزية مجانية PNG مجموعة مجانية من الملصقات والعناصر الفانتازية ثلاثية الأبعاد بصيغة PNG وخلفية شفافة، جاهزة للإضافة إلى التصاميم بدون قص أو إزالة خلفية. يمكن استخدامها في التصاميم الشخصية، منشورات السوشيال ميديا، القصص، البطاقات، المشاريع التعليمية، أغلفة الملفات وخلفيات الهاتف. خلفية شفافة ملفات PNG جاهزة للدمج مباشرة داخل التصميم. تصميم فانتازي تفاصيل ثلاثية الأبعاد وألوان مناسبة للمشاريع الإبداعية. محتويات المقال 01 ما الذي يميز المجموعة؟ 02 أين يمكن استخدام الملصقات؟ 03 استخدامها داخل برامج التصميم 04 معاينة وتحميل الملصقات 05 أسئلة شائعة ...

بحث هذه المدونة الإلكترونية