सीएसएस टेक्स्ट इफ़ेक्ट जेनरेटर

अधिकांश सीएसएस टेक्स्ट-इफ़ेक्ट गैलरी आपको एक निश्चित प्रीसेट सौंपती हैं: एक नियॉन चमक, एक 3डी एक्सट्रूज़न, इसे लें या छोड़ दें। यह जनरेटर आपके द्वारा वास्तव में टाइप किए गए टेक्स्ट के बजाय आपके पैरामीटर से सीएसएस बनाता है। प्रभाव चयन से नियॉन ग्लो, 3डी-एक्सट्रूड, लेटरप्रेस/एम्बॉस, आउटलाइन या ग्रेडिएंट-फिल चुनें, उस प्रभाव के स्वयं के नियंत्रणों को समायोजित करें, और लाइव पूर्वावलोकन के साथ-साथ इसके नीचे कॉपी करने योग्य सीएसएस ब्लॉक को हर बदलाव पर अपडेट करें।

3डी-एक्सट्रूड प्रभाव समझने लायक है: चुनी गई गहराई (खड़ी परतों की संख्या) और कोण के लिए, परत i को क्षैतिज रूप से i × cos (कोण) और लंबवत रूप से i × पाप (कोण) द्वारा ऑफसेट किया जाता है, वास्तविक त्रिकोणमितीय कार्यों के साथ जावास्क्रिप्ट में गणना की जाती है - पूर्व निर्धारित कोणों की लुकअप तालिका से नहीं पढ़ा जाता है। 45 डिग्री पर क्षैतिज और ऊर्ध्वाधर ऑफसेट प्रत्येक परत के लिए बराबर निकलते हैं, क्योंकि 45 डिग्री की कोसाइन और साइन समान मान हैं; कोण स्लाइडर को घुमाएँ और 'टेक्स्ट-शैडो' परतों के पूरे ढेर को वास्तविक समय में अक्षरों के चारों ओर घूमते हुए देखें, प्रत्येक ने एक जले हुए 3D चेहरे को नकली बनाने के लिए पिछले की तुलना में थोड़ा अधिक गहरा कर दिया है।

नियॉन चमक एक वैकल्पिक झिलमिलाहट के साथ, आपके चुने हुए रंग में बढ़ते धुंध त्रिज्या की चार 'टेक्स्ट-शैडो' परतों को ढेर कर देती है: इसे टॉगल करें और अपारदर्शिता डिप्स के यादृच्छिक अनुक्रम के साथ एक '@keyframes' नियम उत्पन्न होता है और लाइव एनिमेटेड होता है, और एक शफ़ल बटन आपको हाथ से एक भी कीफ़्रेम लिखे बिना पैटर्न को फिर से रोल करने देता है। उल्लिखित पाठ उन ब्राउज़रों के लिए `-वेबकिट-टेक्स्ट-स्ट्रोक` लागू करता है जो इसका समर्थन करते हैं, साथ ही उन लोगों के लिए एक ईमानदार 8-दिशात्मक `टेक्स्ट-शैडो` फ़ॉलबैक लागू होता है जो इसका समर्थन नहीं करते हैं - दोनों पंक्तियाँ कॉपी किए गए सीएसएस में क्यों पर एक नोट के साथ भेजी जाती हैं। ग्रेडिएंट-फिल क्लिप `बैकग्राउंड-क्लिप: टेक्स्ट` के साथ टेक्स्ट आकार में `लीनियर-ग्रेडिएंट` को क्लिप करता है, जो अब व्यापक समर्थन के साथ एक मानक संपत्ति है, जो पुराने इंजनों के लिए पुरानी `-वेबकिट-` उपसर्ग लाइन को बनाए रखता है।

सब कुछ आपके ब्राउज़र में स्थानीय रूप से प्रस्तुत होता है - आपके द्वारा टाइप किया गया कोई भी पाठ कभी भी कहीं नहीं भेजा जाता है। जब प्रभाव की आवश्यकता हो तो `@keyframes` नियम सहित तैयार सीएसएस ब्लॉक को सीधे अपनी स्टाइलशीट में कॉपी करें।