# emotion

اكتشف أسلوبًا جديدًا لكتابة الأنماط في JavaScript يركز على الإبداع والكفاءة.

[Website](https://emotion.sh/docs/introduction) [GitHub](https://github.com/emotion-js/emotion#main)

صُممت Emotion لكتابة أنماط CSS بفاعلية باستخدام JavaScript، وتوفر إمكانات قوية لتركيب الأنماط تضمن تجربة ممتازة للمطورين.

تدعم الأنماط النصية والكائنية، مع مجموعة متنوعة من الأساليب المناسبة للاستخدام المباشر أو للتكامل مع أطر عمل مثل React. إحدى حزمها الأساسية، `@emotion/css`، مستقلة عن أطر العمل، ما يعني إمكانية استخدامها في بيئات متنوعة دون إعداد إضافي أو تغيير في التكوين. تشمل ميزاتها الرئيسية إضافة بادئات الموردين تلقائيًا، والمحددات المتداخلة، واستعلامات الوسائط، ما يسهّل عملية تنسيق الأنماط.

إلى جانب الأنماط العامة والتصاميم المتجاوبة، توفر Emotion دعمًا قويًا للتصيير من جهة الخادم، ما يجعلها خيارًا متعدد الاستخدامات لتطبيقات الويب الحديثة. وتبسّط الحزمة إنشاء أسماء الأصناف ودمجها عبر الدالة `css` والأداة `cx`، بما يتيح إدارة فعالة للأنماط بين المكونات.

## الميزات

- مستقلة عن أطر العمل
- إضافة بادئات الموردين تلقائيًا
- دعم المحددات المتداخلة
- دعم استعلامات الوسائط
- دعم التصيير من جهة الخادم
- حقن الأنماط العامة
- تنسيق ديناميكي باستخدام السمات
- تركيب أسماء الأصناف بسهولة

إعلانك هنا؟

[راسلنا عبر البريد الإلكتروني](mailto:hi@dennn.is?subject=%D8%A7%D9%84%D8%A5%D8%B9%D9%84%D8%A7%D9%86%20%D8%B9%D9%84%D9%89%20KickstartUI)

[إعلان مجموعة إضافات جاهزة للوكلاء من أجل WordPress.](https://sleekwp.com/?ref=kickstartui)

## عناصر ذات صلة

### [Master CSS](https://kickstartui.com/ar/details/master-css/)

يعيد هذا المنتج المبتكر ابتكار طريقة كتابة CSS وتطبيقه، إذ يجمع بين البساطة والأداء لتصميم الويب وتطويره بفاعلية.

**نجوم GitHub**

1.8K

**تاريخ التحديث**

Dec 5, 2024

**الترخيص**

MIT License

### [styled-components](https://kickstartui.com/ar/details/styled-components/)

مكتبة قوية تتيح لك استخدام CSS في JavaScript لتنسيق مكوناتك بسلاسة.

**نجوم GitHub**

40.6K

**تاريخ التحديث**

Dec 6, 2024

**الترخيص**

MIT License

### [StyleX](https://kickstartui.com/ar/details/stylex/)

توفر هذه المكتبة نهجًا مبسطًا لتنسيق تطبيقات الويب، باستخدام التنسيقات الذرية لضمان الكفاءة وسهولة الصيانة.

**نجوم GitHub**

8.4K

**تاريخ التحديث**

Dec 6, 2024

**الترخيص**

MIT License

### [ChakraUI](https://kickstartui.com/ar/details/chakra-ui/)

أنشئ تطبيقات ويب سهلة الوصول بسرعة وكفاءة باستخدام مجموعة متينة من المكونات الأساسية سهلة الاستخدام والقابلة للتخصيص بدرجة عالية.

**نجوم GitHub**

38.1K

**تاريخ التحديث**

Dec 6, 2024

**الترخيص**

MIT License

### [UnoCSS](https://kickstartui.com/ar/details/unocss/)

محرك قوي قابل للتخصيص، يتيح للمطورين إنشاء التصميمات بسرعة دون القيود المعتادة لأطر عمل CSS التقليدية.

**نجوم GitHub**

16.8K

**تاريخ التحديث**

Dec 6, 2024

**الترخيص**

MIT License

### [Tailwind CSS](https://kickstartui.com/ar/details/tailwindcss/)

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

**نجوم GitHub**

83.7K

**تاريخ التحديث**

Dec 6, 2024

**الترخيص**

MIT License

### [Tamagui](https://kickstartui.com/ar/details/tamagui/)

تقدم هذه المكتبة حلاً قويًا لبناء واجهات المستخدم باستخدام React وReact Native، مع الجمع بين الكفاءة والمرونة.

**نجوم GitHub**

11.7K

**تاريخ التحديث**

Dec 6, 2024

**الترخيص**

MIT License

### [Skeleton](https://kickstartui.com/ar/details/skeleton/)

مجموعة أدوات متكيفة ومتاحة للجميع تعزز تطوير تطبيقات الويب الحديثة.

**نجوم GitHub**

228

**تاريخ التحديث**

Dec 26, 2023

**الترخيص**

MIT License