10 個驚人的 CSS 和 HTML 復古字體效果

Hipstamatic、Spotify 和現在的阿迪達斯：似乎我們的社會對舊時光和舊方式有著巨大的渴望。 也許我們的市場充滿了高科技和創新的一切，以至於我們開始感到無聊。 或許這只是對舊時代的一種平庸的懷舊之情，那時一切似乎都很容易、簡單和玫瑰色。 當前對近期一切事物的痴迷是顯而易見的。 隨處可見，網頁設計領域也不例外。

事實上，復古風格在網絡上時不時地表現出來。 它通過柔和的複古調色板、雙色調效果、大膽過分簡化的幾何印花、裝飾藝術插圖、顆粒狀和嘈雜的效果、寶麗來圖像、小報風格的佈局、從老式遊戲中拍攝的風景，當然還有老式 -及時的排版。

說到這一點，排版是在項目中註入令人興奮的複古感覺時最受歡迎的選擇之一。 它微妙而有品味。 而且，最重要的是，它不會使項目不堪重負或超載。 這只是一個完美的畫龍點睛，吸引眼球並建立適當的氛圍。

此外，借助深受喜愛的 CSS/JS 和 SVG 三重奏，您可以快速重現 80 年代或 90 年代的效果。 只需將效果應用於任何單詞並在幾秒鐘內獲得所需的結果。 而且您無需使用照片編輯或與設計相關的程序（如 Photoshop 或 Sketch）來進行更改。 簡單優雅，不是嗎？

如果您喜歡這種完成工作的方式，我們收集了 10 個具有驚人復古排版效果的代碼片段。 讓我們來看看：

離開了這個國家

我們忍不住從 Gabrielle Wee 的這個出色的代碼片段開始我們的收藏。 她的項目被稱為離開這個國家，主要是受到 Duffer Brothers 的恐怖電影“Stranger Things”的啟發。 大量的設計師和開發人員已經復制了它。 Dribbble 和 Codepen 在節目的介紹中充滿了專業人士。 甚至還有由 Nelson Cash 開發的生成器，可讓您使用數據重新創建徽標並下載圖像。 但是如果你想避免一切都是靜態的，試試 Wee 的代碼片段，它是一個純 HTML 和 SCSS 解決方案。

沒有空缺 404

Riley Shaw 的 No Vacancy 404 很像 Gabrielle Wee 之前的作品。 它的根源在於奇妙的線條藝術，通過發光的觸感和閃爍效果增強了真實感。 它讓我們想起了上個世紀中葉在美國越來越流行的那些明亮的霓虹燈。 不過，也許它們看起來不像萊利·肖的傑作那樣優雅精緻。 解決方案是優雅、精緻和復古魅力的共生。

復古霓虹燈

需要更多發光效果和美式氛圍？ 然後你應該把注意力轉向 Kyle Lavery 的複古霓虹燈。 感覺就像它走出了 60 年代充滿發光標誌的廣告。 各種直徑的管子、奇妙的發光效果、有爭議的調色板和華麗的字體巧妙地組合在一起，造就了出色的代碼驅動傑作。

分裂：太空入侵者

讓我們回到 80 年代，看看這段代碼的排版效果。 首先，80 年代和 90 年代都是關於電子遊戲的。 我們的童年是如此可愛。 馬丁皮特是設法提醒我們這一點的人之一。 他的分裂：太空入侵者讓我們回到了我們的青少年時期。 這種認識具有積極的氛圍和俏皮的魅力。 它看起來可愛而夢幻。 它是在 Splitting 庫的幫助下創建的，這使得使用 CSS 進行操作變得容易。

玩復古排版

沒有在家用視頻遊戲機 Atari 中玩街機遊戲的 90 年代。 簡直就是極客世界80、90年代的代名詞。 Max Kohler 非常清楚這一點。 他致力於復古排版的 codepen 巧妙地複制了 Atari 標誌。 您還會發現另外四種效果，使刻字具有令人愉悅的複古感。

新復古文本/80 年代排版/404 SVG

我們的收藏中有幾種奇妙的文字效果，讓人想起一些與電視有關的美好回憶。 例如，Vladimir Jovanovic 的 New retro text、David Parker 的 80s Typography 和 Marcos Mellado 的 404 SVG。 雖然前兩個項目使用大膽的排版、光滑的表面、霓虹燈風格和強烈的色彩來營造某種 VHS 復古的介紹氛圍，但第二個項目感覺有點質樸、平凡和粗俗——就像那個時期 MTV 上的音樂視頻剪輯一樣。

復古字體/很棒的複古標題

如果沒有幾個傳統的解決方案，這將不是一個完整的複古排版效果集合。 我們有兩個很棒的代碼片段：Thibault Jan Beyer 的 Vintage Typeface 和 Kevin Nagata 的 Awesome Vintage Title。 它們都展示了一種傳統的複古字體，就像我們習慣於想像的那樣：超薄的字體越來越細長，帶有微妙的裝飾藝術風格，當然還有作為藝術品核心和靈魂的陰影。 Thibault Jan Beyer 的項目看起來經典而雄偉； Kevin Nagata 的項目看起來有點現代，帶有某種俏皮的底色。

時光倒流

如果你厭倦了超現代、精緻和高端的一切，那麼是時候拋棄現在，尋找過去的靈感了。 相信我們，它總是有一張王牌在洞裡。 它沒有一次不能挽救這一天。

它為設計師提供了讓項目脫穎而出的趨勢和解決方案。 復古排版效果就是一個完美的例子。 它們是來自過去的歡迎和愉快的爆炸，自然會引起人們的注意，感覺就像呼吸新鮮空氣。