टास्क पथ / इनपुट से परिणाम तक
CSS बैकग्राउंड पैटर्न कैसे बनाएं
- 01
पैटर्न चुनें
पैटर्न खोलें और डॉट्स, ग्रिड या डायगोनल चुनें। तीनों सिर्फ़ CSS ग्रेडिएंट से बनते हैं — किसी भी बिंदु पर कोई इमेज फ़ाइल शामिल नहीं होती। उनके बीच बदलने पर आपके टाइल, मार्क और रंग के मान बने रहते हैं, इसलिए शैलियों की तुलना मुफ़्त है। डिफ़ॉल्ट 28 px डॉट ग्रिड शुरुआत की शांत जगह है।
- 02
टाइल सेट करें
टाइल साइज़ 8 से 96 px और मार्क चौड़ाई 1 से 16 px के बीच चुनें। मार्क टाइल साइज़ के आधे से ज़्यादा नहीं हो सकता; अगर होता है, तो स्थिति सटीक नियम के साथ मान जांचें दिखाती है।
- 03
दोनों रंग चुनें
पैटर्न रंग मार्क खींचता है और कैनवास रंग उनके नीचे की ज़मीन भरता है। सूक्ष्म पैटर्न दोनों के बीच कम कंट्रास्ट से बनते हैं — कैनवास से बस थोड़ा गहरा मार्क सजावट के बजाय बनावट जैसा पढ़ा जाता है।
- 04
असली स्केल पर दोहराव का आकलन करें
पूर्वावलोकन नतीजे को पूरे पैनल में टाइल करता है, और यहीं कमज़ोर कंट्रास्ट व बेचैन टाइलें खुद को बयां करती हैं। अंगूठे का नियम: मार्क को टाइल के आधे से काफ़ी नीचे रखें — 28 px टाइल पर 2 px मार्क शोर नहीं, बनावट लगता है।
- 05
पैटर्न CSS कॉपी करें
toolars-background-pattern.css सहेजने के लिए CSS कॉपी करें या .css डाउनलोड करें दबाएं। .pattern नियम तीन डिक्लेरेशन हैं — background-color, background-image और background-size — किसी भी एलिमेंट के लिए तैयार।
- 06
नियम लगाएं और ढालें
नियम बिना लेआउट साइड-इफ़ेक्ट के किसी भी एलिमेंट पर बैठ जाता है, क्योंकि वह सिर्फ़ बैकग्राउंड पेंट करता है। पैटर्न घनत्व बदलने के लिए बाद में background-size समायोजित करें, और जब पैटर्न टेक्स्ट से टकराए तो मार्क सिकोड़ने के बजाय दोनों रंगों के बीच कंट्रास्ट घटाएं।