大家好，最近發現了一個網站 Omatsuri 挺實用的，這是一個提供 CSS 樣式的網站，非常實用，基本覆蓋了我們平常開發中所遇到的一些場景。

地址：https://omatsuri.app/

圖片

三角形生成

如果你想用 CSS 畫一個三角形，你又不想自己寫，因為太麻煩了，這個時候你可以直接使用這個網站去生成。

圖片

你可以隨意修改顏色、高度、寬度、角度、方向等等，修改完之后，下方會提供現成的 CSS 樣式代碼讓你復制，是不是非常的方便~

圖片

漸變背景顏色生成

平時在做一些官網之類的網站時，也會經常需要將背景顏色設置成漸變風格，這樣更加好看，吸引用戶，但是漸變寫起來非常麻煩，所以可以借助這個網站去實時預覽調試

圖片

可以自行改變起始和結束的顏色，調整漸變程度，方向，并且可以直接復制現成的 CSS 樣式代碼到你的項目中使用

圖片

頁面分割線

當你想要給你的網頁加上一些好看的分割線，不想太單調時，你也可以使用這個網站去生成獲取，它提供了好幾種風格任你挑選，老規矩，會提供給你現成的代碼讓你復制

圖片

鼠標光標樣式

當你想要改變你的鼠標光標樣式時，你可以到這個網站上看一看，看看有沒有你想要的光標樣式

圖片

生成 mock 數據

當你想生成 mock 數據來調試頁面時，也可以在這個網站上進行生成，通過 JSON SCHEMA 的方式進行定義生成即可

圖片

自動生成鍵盤事件監聽代碼

我們開發中可能需要監聽鍵盤事件，但是不知道特定的按鍵怎么監聽，這個時候可以到這個網站上，只需要按下你想監聽的按鍵，頁面上就會自動生成你這個按鍵的監聽事件代碼，供你復制

圖片

base64

你可以上傳文件，讓它幫你轉換成 base64 格式

圖片

SVG 轉 JSX

圖片