10 تأثيرات مدهشة من نوع CSS و HTML

Hipstamatic و Spotify والآن Adidas: يبدو أن مجتمعنا لديه رغبة كبيرة في الأيام الخوالي والطرق القديمة. ربما يكون سوقنا مشبعًا جدًا بكل ما هو عالي التقنية ومبتكر لدرجة أننا بدأنا نشعر بالملل. أو ربما كان مجرد حنين عادي إلى العصور القديمة عندما بدا كل شيء سهلًا وبسيطًا ولونًا ورديًا. إن الهوس الحالي بكل شيء من الماضي القريب واضح. يمكن رؤيته في كل مكان ، ومجال تصميم الويب ليس استثناءً.

في الواقع ، يتجلى النمط الرجعي من وقت لآخر في الويب. إنه يظهر من خلال لوحات ألوان الباستيل الرجعية ، وتأثيرات ثنائية اللون ، والمطبوعات الهندسية الجريئة المفرطة في التبسيط ، والرسوم التوضيحية لآرت ديكو ، والتأثيرات المحببة والصاخبة ، والصور التي تشبه Polaroid ، والتخطيطات المستوحاة من التابلويد ، والمناظر المأخوذة من ألعاب المدرسة القديمة ، وبالطبع- وقت الطباعة.

عند الحديث عن ذلك ، تعد الطباعة واحدة من أكثر الخيارات شيوعًا عندما يتعلق الأمر بغرس إحساس رجعي في المشروع. إنه دقيق ولذيذ. والأهم من ذلك أنه لا يثقل كاهل المشروع ولا يثقل كاهله. إنها مجرد لمسة نهائية مثالية تلفت الأنظار وتخلق جوًا مناسبًا.

علاوة على ذلك ، يمكنك إعادة إنتاج التأثيرات بسرعة من الثمانينيات أو التسعينيات بمساعدة الثلاثي المحبوب من CSS / JS و SVG. ما عليك سوى تطبيق التأثير على أي كلمة والحصول على النتيجة المرجوة في ثوانٍ. ولست بحاجة إلى العبث بتحرير الصور أو البرامج المتعلقة بالتصميم مثل Photoshop أو Sketch لإجراء تعديلات. بسيطة وأنيقة ، أليس كذلك؟

إذا كنت من الأشخاص الذين يقدرون هذه الطريقة في إنجاز الأمور ، فقد جمعنا 10 مقتطفات من التعليمات البرمجية بتأثيرات طباعة رجعية مذهلة. لنلقي نظرة:

ترك البلدة

لا يسعنا إلا أن نبدأ مجموعتنا مع مقتطف الشفرة الرائع هذا من Gabrielle Wee. يُطلق على مشروعها اسم Left the Country وكان مستوحى بشكل أساسي من فيلم Stranger Things الذي أطلقه الأخوان Duffer. قام عدد كبير من المصممين والمطورين بإعادة إنتاجه. يعج Dribbble و Codepen بالمتخصصين في مقدمة العرض. يوجد أيضًا مولد تم تطويره بواسطة Nelson Cash يسمح لك بإعادة إنشاء شعار ببياناتك وتنزيل الصورة. ولكن إذا كنت ترغب في تجنب كل شيء ثابتًا ، فجرب مقتطف رمز Wee وهو حل HTML و SCSS خالص.

404

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

خمر النيون

هل تحتاج إلى المزيد من التأثيرات المتوهجة والأجواء الأمريكية؟ ثم يجب أن تحول انتباهك إلى Vintage Neon Sign بواسطة Kyle Lavery. يبدو الأمر وكأنه خرج من الإعلانات من الستينيات التي كانت مكتظة بعلامات مضيئة. إن المزيج الذكي من الأنابيب بأقطار مختلفة ، وتأثير التوهج الرائع ، ولوحة الألوان المثيرة للجدل ، والمحرف الرائع يؤدي الغرض ، مما ينتج عنه تحفة رائعة مدعومة بالشفرات.

الانقسام: غزاة الفضاء

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

اللعب بالطباعة الرجعية

لا توجد ألعاب 90s بدون ألعاب أركيد يتم لعبها في وحدة تحكم ألعاب الفيديو المنزلية Atari. إنه مجرد مرادف للثمانينيات والتسعينيات في عالم المهوسين. وماكس كوهلر يعرف ذلك جيدًا. يتميز رمزه المخصص للطباعة الرجعية بإنتاج شعار أتاري بمهارة. ستجد أيضًا أربعة تأثيرات أخرى تضفي على الحروف لمسة رجعية لطيفة.

نص ريترو جديد / طباعة 80 ثانية / 404 SVG

هناك العديد من التأثيرات النصية الرائعة في مجموعتنا والتي تعيد إلى الأذهان بعض الذكريات الجميلة المتعلقة بالتلفزيون. على سبيل المثال ، نص قديم جديد بقلم فلاديمير يوفانوفيتش وطباعة الثمانينيات لديفيد باركر و 404 SVG لماركوس ميلادو. في حين أن المشروعين الأولين يستخدمان الطباعة الجريئة والسطح اللامع وأسلوب النيون والتلوين الصارم لمقدمة VHS الرجعية ، فإن المشروع الثاني يشعر بريف بسيط ودنيوي وخفيف - تمامًا مثل مقاطع الفيديو الموسيقية على MTV من تلك الفترة.

محرف عتيق / عنوان عتيق رائع

لن تكون هذه مجموعة كاملة من تأثيرات الطباعة القديمة بدون بعض الحلول التقليدية. ولدينا مقتطفان رائعان من التعليمات البرمجية: Vintage Typeface بواسطة Thibault Jan Beyer و Awesome Vintage Title بقلم كيفين ناجاتا. يُظهر كلاهما محرفًا تقليديًا عتيقًا ، تمامًا كما اعتدنا على تخيله: نحيف للغاية مع أشكال حروف مطولة بشكل متزايد ، ولمسة فنية دقيقة ، وبالطبع ظل يمثل قلب وروح العمل الفني. بينما يبدو مشروع Thibault Jan Beyer كلاسيكيًا ومهيبًا ؛ يبدو مشروع كيفن ناجاتا حديثًا بعض الشيء مع بعض اللمسات المرحة.

الرجوع بالزمن

إذا سئمت وتعبت من كل شيء حديث للغاية ومتطور وعالي الجودة ، فقد حان الوقت للتخلي عن الحاضر والبحث عن الإلهام في الماضي. صدقنا ، دائمًا ما يكون له آس في الحفرة. لم تفشل مرة واحدة في إنقاذ اليوم.

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