你有多久没有认认真真的看过网页了

作为一个前端爱好者，我平时喜欢看各种各样的网站，一是为了丰富自己，二也能看看现在网页可以做到什么地步。 今天我就带来几个最近发现的挺有思的网站，我称它们是「有趣的灵魂」。

观看提示：
都是些 PC 站。
需要能链接到谷歌，因为有的站用了谷歌的服务。
并非 NSFW，可放心打开。
如果你也是个前端，建议看的时候先想一下实现原理在查看源码。

1.https://www.cupnoodle.jp/uragawa/
日本某著名包面，推荐这个是觉得不得不佩服设计师的想法，因为整个站并没用有用到 canvas，仅仅用了 background+opacity，就呈现了类似 iPhone 官网的效果，滑到下面叉子挑起泡面的那个，做的真的太棒了。

2.https://yolele.com/
某零食商城，英文站的优势就是字体文件小，一个好的字体包就能提升整个网站的美感，加上一个比较新颖的页面转场效果，体验是不是很棒？其实还有许多细节值得讲一下的，就比如滚动，这个站应该代理了滚动事件，用 translate 来代替滚动效果，好处就是滚动会变得跟用苹果触摸板一样丝滑，但是坏处也很明显，很多原生的方法和事件基本等于瘫痪了。

3.https://blackmeal.com/
还没整明白是做啥的站，但是做的很，话就多说了，自己体会吧。

4.https://tailwindcss.com/
tailwindcss，是最近越来越火的 css 框架了，我相信很多人应该打开过，但你也许跟平时看苹果官网一样没注意过细节，比如首屏的打字效果并不是视频。。之后的每个介绍里不光切换效果的动效每个都不一样，右面的代码也是跟着联动的。我觉得这可能也是为啥会火的原因之一。

5.https://14islands.com/
不用管这是干啥的，看就完事了。这绝对是我近些年来，见过的最心服口服的网站了。整个站跟 canvas 结合的天衣无缝，我相信任何一个前端打开都会被震惊，（也许也不一定，毕竟我还是个菜鸟），到目前我还没有研究透里面一些效果的实现方式。所以欢迎评论里讨论。

好了这次就分享这些，如果你也跟我的爱好相同又不知道在哪能找到这些乱七八糟的站,我整理了一个（对我的导航） https://xxoo.link/inspiration-collection 都在这。 如果你比较懒，等我下次在分享吧。