پيدا ڪندڙ
تجارتي استعمال صحيح
581 ماڊل
ڪو واھ مارڪ نه
ڪوبه رجسٽريشن جي ضرورت نه آھي
ماڊل:
+ GPT-5, Claude, Gemini
Describe a layout or component and get modern CSS3 - Grid + Flexbox, custom properties, container queries, color-mix(), :has() selectors, prefers-reduced-motion. Mobile-first by default. Self-hosted Qwen 3 Coder is free under the daily pool; premium models nail complex multi-component design systems.
وڌيڪ اختيار
نتيجو
ھيءُ
وڌيڪ ٽوڪنز حاصل ڪريو
وڌيڪ گھرو ٿا؟
مفت ۾ رجسٽر ٿيو: 30,000 tokens/day
مفت ۾ رجسٽر ٿيو
توھان جو درخواست عمل ۾ آڻيو پيو وڃي...
AI سان مفت ۾ CSS ڪوڊ پيدا ڪريو.
استعمال ڪرڻ جو طريقو پيدا ڪندڙ
1
پنھنجي داخلا داخل ڪريو
متن لکجو، فائل اپ لوڊ ڪريو يا جيڪي توهان چاهيو ٿا سو بيان ڪريو. ڪوبه اڪائونٽ نه گھرجي.
2
پيدا ڪرڻ لاءِ ڪلڪ ڪريو
اسان جو AI توهان جي درخواست کي سيڪنڊن ۾ بهترين مفت-سورس ماڊلز استعمال ڪندي پروسيس ڪندو.
3
ڊائون لوڊ ۽ ونڊو
پنھنجو نتيجو ڊائون لوڊ ڪريو، ڪاپي ڪريو يا ورهائي ڏيو. پاڻيءَ ۽ تجارتي استعمال لاءِ مفت.
ھي توھان جي API استعمال ڪريو
پنھنجي ڪوڊ مان ھڪ وسيلن کي خودڪار ڪريو. OpenAI-compatible REST endpoint, Bearer-token auth, no extra SDK required. Token costs match the web interface.
curl -X POST https://api.free.ai/v1/chat/ \
-H "Authorization: Bearer sk-free-..." \
-H "Content-Type: application/json" \
-d '{"model": "qwen-coder", "messages": [{"role": "user", "content": "Write a Python function that reverses a string."}]}'پيدا ڪندڙ - FAQ
& جديد CSS3 - گريڊ + Flexbox ترتيبون، پسنديده خاصيتون (CSS متغیرات)، ڪنٽينر سوال، color- mix ()،: has () چونڊيندڙ، منطقي خاصيتون، پسنديده- گهٽتائي- موٽر فالبڪ. 8 انداز اڳيون (Vanilla / Tailwind config / Sass / CSS Modules / BEM / Atomic utility / Print stylesheet / Animation). موبائيل- پھريون ڊفالٽ سان ڪنٽينر سوالن جتي اهي ميڊيا سوالن کي ڀڄي.
هاء - هڪ مڪمل جزو stylesheet Qwen 3 ڪوڊر تي ~1,000 ٽوڪنز خرچ, 6,000 نامعلوم / 30,000 داخل ٿي-up روزاني پول اندر. Premium Claude Sonnet / GPT-5 موجود per-call لاء پيچيده multi-component ڊزائين سسٽم.
v0 by Vercel (آزاد ٽير + $ 20 / مهينو پرو) رد عمل + Tailwind حصن پيدا ڪري ٿو. Tailwind UI ($ 299 زندگي) هڪ ادا ڪيل حصي جي لائبريري آهي. ڪرسر ($ 20 / مهينو) ۽ Copilot ($ 10-39 / مهينو) هڪ IDE اندر مدد ڪري ٿو. اسان جو اوزار هڪ-شٽ CSS آهي - هڪ بيان کي پيڪ ڪريو، ڪراس-برائوزر-سڀني محفوظ CSS حاصل ڪريو. Tailwind سان گڏ ڀائيوارن سان گڏ: Tailwind config کي اڳ ۾ ئي تبديل ڪريو ۽ اسين raw CSS جي بدران tailwind.config.js + utility ڪلاس لکندا.
ھائو - موضوعن لاءِ CSS خاصيتون، @layer cascade ڪنٽرول لاءِ، ڪنٽينر سوال (@container) جتي پيء-سڃاڻپ واري سائيز ڏسڻ واري پورٽ کي ٽوڙي ٿي، :has () پيء-آسان انداز لاءِ، رنگ فنڪشن جيئن color-mix () ۽ OKLCH رسائي واري رنگ جي سنڀال لاءِ. جتي ضرورت هجي اتي نرميءَ سان موٽائي.
Teilwind config preset چونڊيو. نڪتو Teilwind 3.x utility classes آهي جيڪو توهان جي tailwind.config.js سان ڳنڍيل آهي (جيڪڏھن توهان موضوع جي ترتيب ڏيڻ لاءِ پڇو ته اسان ان سان گڏ پيدا ڪنداسين). HTML مارڪ اپ لاءِ جيڪو ڪلاسن کي ورائيندو آهي ، /code/html/ ڏانهن تبديل ڪريو ۽ Teilwind preset چونڊيو.
Sass اڳيون ترتيب چونڊيو..scss سنتاڪس استعمال ڪندي @use ماڊولز سان (@import نه پراڻي) ، جتي واضحي جي مدد ڪري ٿو (سڀني سان نه) ، @mixin استعمال ٿيندڙ نمونن لاءِ ، @function قدر جي حساب لاءِ. Dart Sass 1.50+ سان مطابقت رکي ٿو.
جيوت جي اڳيون ٺاھي چونڊيو. نڪتو @keyframes استعمال ڪندو آھي cubic-bezier timeing سان، ترجيح-reduced-motion: رسائي لاءِ overrides گھٽائي ٿو، صرف انھن خاصيتن تي تبديل ڪندو آھي جيڪي جيوت ڪن ٿا. جتي ممڪن آھي CSS-only (transforms, opacity); جاوا اسڪرپٽ hooks صرف غير CSS-capable اثرات لاءِ صلاح ڏنل آھن.
ٻئي -.block__element--modifier naming لاءِ BEM چونڊيو، يا Atomic utility هڪ مقصد واري ڪلاس لاءِ. حصي-اچيندڙ CSS لاءِ بغير نالي جي وڙھڻ جي CSS Modules چونڊيو، جيڪو مقامي-اچيندڙ ڪلاس نالا پيدا ڪندو.
ھائو - سڀئي اڳيون ترتيب ڏنل استعمال ڪن ٿا CSS خاصيتون [data-theme=dark] plus a prefers-color-scheme: dark media query fallback. ٽولنگ ٽِيم ھڪ لائين خاصيت جي تبديلي آھي، ڪو CSS recompile نه آھي. Tailwind اڳيون ترتيب ڏنل استعمال ڪري ٿو ٺاھيل dark: قسم.
evergreen Chrome / Firefox / Safari (آخري ٻه مستحڪم رليزون) کي نشانو بڻايو. @supports blocks استعمال ڪري ٿو cutting-edge خاصيتن لاءِ (: has ()، ڪنٽينر سوال) جتي Safari 16+ اهميت رکي ٿو. flexcbox ڏانهن موٽندو جتي پراڻي Safari توهان سان جنگ ڪري ٿو. IE11 لاءِ مدد - معاف ڪجو ، توهان کي / code / refactor / استعمال ڪرڻ گهرجي خروجي کي هٿ سان backport ڪرڻ لاءِ.
پرنٽر اسٽائيل شيٽ جو اڳيون ترتيب چونڊيو. نڪتو @mediaprint ۾ سڀڪنھن شيءِ کي ورائيندو آھي، رنگ-تعديل: پس منظر لاءِ صحيح مقرر ڪندو آھي، nav ۽ chrome لڪائيندو آھي، تصويرن جي سائيز کي سمجھداريءَ سان ورائيندو آھي، صفحا صاف ڦاٽل سان ڦاٽل- اندر: ڪارڊن تي نه وڃايو. صفحي-موج جي صلاحيت @page ذريعي.
ھائو - POST to /v1/chat/ with the same system prompt this page builds. bearer auth, rate-limited. design-token pipelines or component-library generators. Docs at /api/.
ھن اوزار کي ڪيئن تصنيف ڪندؤ؟