みなさんこんにちは!おさかなです!
今回は『Haikei』について、書いていこうと思います!
それでは、レッツゴー!!!!!
『Haikei』って何?
『Haikei』とは波線やドット柄、星など、さまざまなパターンの「背景画像」を生成できるツールのことです。PNGまたはSVG形式で保存可能!
色味やコントラスト、画像サイズなども細かくカスタマイズできるため、汎用性の高い画像がゲットできます。(いいね👍)
![](https://osakanav.com/wp-content/uploads/cocoon-resources/blog-card-cache/d632322e3c5f03ed8de27199986546fb.png)
![](https://osakanav.com/wp-content/uploads/2022/08/sozaiyairis-top-160x90.gif)
実際に使ってみよう!
それでは早速サイトにアクセスしましょう!
![](https://osakanav.com/wp-content/uploads/2023/05/haikei.png)
左側から「模様パターン」を選択できます。
![](https://osakanav.com/wp-content/uploads/2023/05/ROYkBieGsGOSK5a1683195862_1683195875.png)
「Blurry Cradient」はこんな感じ!(海みたいでキレイ~🌊)
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-sh.png)
他にも「Blob Scene」や……。
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-blod.png)
波が重なったようなデザインの「Stacked Waves」
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-wave.png)
まるで宝石のような凹凸を表現した「Low Poly Grid」
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-grid.png)
デジタル風の「Layered Steps」
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-steps.png)
キラキラの星マークが印象的な、「Symbol Scatter」などがあります。(星かわいい🌠)
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-symbol.png)
![](https://osakanav.com/wp-content/uploads/2023/01/animated-top-160x90.png)
カスタマイズしよう!
中央にある「ボタン」をクリックすると……?
![](https://osakanav.com/wp-content/uploads/2023/05/wOifIAgzMiMztJh1683196315_1683196472.png)
こんな感じで、模様を変化させることができます。(おお!)
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-wave.gif)
右側の「メニュー」では、画像サイズやデザインの外枠などのカスタマイズが可能。
![](https://osakanav.com/wp-content/uploads/2023/05/ROYkBieGsGOSK5a1683195862_1683195923.png)
使用する場所に合わせた、さまざまな設定ができます。(たて型の背景画像に!)
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-size.png)
また16進数のカラーコード・カラーパレットから、色の変更もできます。
![](https://osakanav.com/wp-content/uploads/2023/05/wOifIAgzMiMztJh1683196315_1683196326.png)
(色が変わると、雰囲気も変わるね✨)
![](https://osakanav.com/wp-content/uploads/2023/05/haikei-color-1.png)
(ひと休み🍀)
保存しよう!
画像を保存するときは「Download」より、形式を選択。SVGまたはPNGから選べるため、ぜひご活用ください🌸(お疲れ様です☕)
![](https://osakanav.com/wp-content/uploads/2023/05/ROYkBieGsGOSK5a1683195862_1683195950.png)
↓実際に作成したものがこちら
![](https://osakanav.com/wp-content/uploads/2023/05/symbol-scatter-haikei.png)
![](https://osakanav.com/wp-content/uploads/2023/05/stacked-peaks-haikei.png)
![](https://osakanav.com/wp-content/uploads/2023/05/layered-waves-haikei.png)
Amazon:どうする?デザイン クライアントとのやりとりでよくわかる!デザインの決め方、伝え方ingectar-e (著)
![おさかな](https://osakanav.com/wp-content/uploads/2019/08/osakana.jpg)
Hi,Kei!(こんにちは、ケイ)
![ナビまる](https://osakanav.com/wp-content/uploads/2019/09/navmaru-2.jpg)
どこの英語教材だよ。笑
これで全ての操作は完了です。(やった~!)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました!
![](https://osakanav.com/wp-content/uploads/2023/04/petalica-top-160x90.png)