() translation by (you can also view the original English article)
CodePen快速的成為了一個門庭若市的地方，供大家來展示我們的網頁創意。 這裡有一個列表，列出了一些最近人們創建的很不錯的CSS動畫！
1. JavaScript米奇手錶
蘋果手錶造型米奇手錶由Jay Salvat提供（@jaysalvat）
這是一個非常可愛的混合CSS變換功能、SVG圖像以及JavaScript來將一雙可愛的手放置到米老鼠手錶盤的案例。
2. CSS 潛水艇
潛水艇和CSS 由Alberto Jerez提供（@ajerez）
華麗的使用圓形的孔洞容器給了這個CSS動畫效果的潛水艇更多的魅力。
3. ASCII AT-AT機器人
AT-AT 由Tim Pietrusky提供（@TimPietrusky）
以星戰為靈感的AT-AT運輸人員，使用文字來繪製的圖形並帶有顏色循環變換的CSS。 時髦的特效。
4. SVG/CSS加載標誌
這是一個加載器，使用了顏色變化來使視覺上覺得是在旋轉。
5.3D CSS 時間機器Tardis
3D CSS 時間機器Tardis 由Gerwin van Royen提供（@Gerwinnz）
CSS可以被用作創建一些令人驚奇的3D效果。 這裡就是一個3D的時間機器tardis：
6. 犯困的小鳥
簡單的藝術樣式，剛剛好程度的動畫效果，這些都給了這個犯困的小鳥鮮活的生命。
7. 純CSS邊框動畫
純CSS非SVG邊框動畫效果 由Rplus提供（@rplus）
簡單但又非常有效地使用CSS邊框（border）來創建一個讀取效果的動畫。
8. 星球大戰：原力覺醒
星球大戰：原力覺醒CSS 由Donovan Hutchinson提供（@donovanh）
這個標題是從最新的新球大戰電影來的靈感，使用了CSS、HTML和一點點JavaScript創建的。
9. 3D合成器
純CSS3D合成器（鼠標按住可以旋轉）由Nikolay Talanov提供（@suez）
試試按鍵以及旋轉這個3D的合成器，這是CSS創建的。 傑作！
10. 層疊式太陽系系統
層疊式太陽系系統！由Tady Walsh提供（@tadywankenobi）
一個我們太陽系天體系統的模型，具有加快但成比例的旋轉速度、月亮以及大型天體的細節等等。 太陽甚至是由真實的照片截取的的圖片 ！
11. 3D太陽系系統
全CSS 3D太陽系系統 由Wayne Dunkley提供（@waynedunkley）
另一個太陽系系統示意圖，不過這次是全3D的。 漂亮的對於陰影的應用。
12. 扁平化設計相機
扁平化設計相機CSS動畫 由Damien Pereira Moberto提供（@damienpm）
在這個扁平化設計的相機上按下快門，看看它使用CSS動畫創建的照片。
13. 白天和晚上的轉換
白天和夜晚的轉換模擬器 由Szymon Stypa提供（@Catagen）
按下面的按鈕來看白天轉換到晚上的效果。
14. 動畫圖片和CSS
動畫效果圖片和CSS 由Avaz Bokiev提供（@samakandiy）
這是一個範例顯示了序列圖片（動畫）可以被用來創建單格拍攝動畫，使用了前進和倒退的動作來完成。
15. 正十二面體
這是一個精細的、漂亮的正十二面體，這個動畫是完全由CSS創建的。
結論
不久之前，我們可能學了Flash或者JavaScript工具為了實現任何的瀏覽器動畫， 不過現代的瀏覽器已經有了更好的對於CSS的支持，以及硬件加速3D和動畫。
感謝類似於CodePen這樣的網站， 我們可以比以前更簡單的分享和學習代碼， 那麼最近你有什麼富有靈感的代碼樣本呢？
