أدوات المطورين

تنسيق CSS أونلاين

نسّق CSS مع مسافات وتنظيم واضح.

كل الأدوات

تنسيق CSS

رفع ملف
اسحب وأفلت ملفاً هنا أو اختر ملفاً.
الإدخال
المخرجات

طريقة الاستخدام

  1. الصق كود CSS في الإدخال.
  2. اضغط Beautify لتنظيم التنسيق.
  3. انسخ الناتج أو نزّله كملف.

أفضل الممارسات

  • لأفضل أداء، ابدأ بمدخلات صغيرة أولاً.
  • عاين المخرجات قبل التنزيل أو المشاركة.
  • تجنب لصق بيانات حساسة على أجهزة مشتركة.

الخصوصية

بعض الأدوات تعمل داخل المتصفح. بعض الميزات قد تتطلب معالجة على الخادم.

أمثلة
مثال 1
الإدخال
body{margin:0;padding:0}.btn{background:#6366F1;color:#fff;padding:10px 14px;border-radius:10px}
المخرجات

                                    

                                        
                                    

                                

                            

                        

                        

                            

                                

                                    
مثال 2

                                

                            

                            

                                

                                    
الإدخال

                                    
@media (min-width: 768px){.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}}

                                    

                                            
                                        
                                    

                                

                                

                                    
المخرجات

                                    

                                    

                                        
                                    

                                

                            

                        

                

            


        

            

                
هل كانت هذه الأداة مفيدة؟