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

地址：https://omatsuri.app/

圖片

三角形生成

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

圖片

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

圖片

漸變背景顏色生成

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

圖片

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

圖片

頁面分割線

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

圖片

鼠標光標樣式

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

圖片

生成 mock 數(shù)據(jù)

當你想生成 mock 數(shù)據(jù)來調(diào)試頁面時，也可以在這個網(wǎng)站上進行生成，通過 JSON SCHEMA 的方式進行定義生成即可

圖片

自動生成鍵盤事件監(jiān)聽代碼

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

圖片

base64

你可以上傳文件，讓它幫你轉(zhuǎn)換成 base64 格式

圖片

SVG 轉(zhuǎn) JSX

圖片