アイコンに使用されている「角丸四角形」はみなさんご存知だと思います。四角形の角が90°ではなく、丸みのある角の四角形です。「角丸四角形」はiPhoneやAndroidなどアプリケーションに使われたり企業のロゴなどにも多く使われています!それに対して膨張角丸四角形とは四角形の角に丸みがあり、さらに角をつなぐ辺も膨張したような丸みがある四角形のことです。膨張角丸四角形はただの角丸四角形よりも少し柔らかい表現になります!最近だとYoutubeやSlackなどが膨張角丸四角形のロゴを採用しています。四角形のシェイプを作成してください!ショートカットキーのMを押すか長方形ツールを選択してください。正方形である必要はないので好きな四角形&色で大丈夫です!ここでは以下のような緑色の正方形を作成しました。2:角丸四角形を作ろう好きな四角形を作成したら角に丸みを追加します。箇所に角丸サイズを選択できます。選択することで表示することができます!今回は30pxを指定しました。クリックしてください。クリックすると以下のような形になると思います。部分をクリックしてください。いう項目が出てきます。このカーブの数値を変更することによって膨張率を変化させることができます。いう項目にチェックを入れておくと、数値を変更した瞬間に膨張率が反映されるのでチェックをつけておくと便利です!カーブ率をマイナスにすると以下のような凹んだ形になります。カーブ率をプラスにすると以下のような膨らんだ形になります。ロゴを重ねてみました!普通の角丸四角形より柔らかい表現ができ、押したらプニプニしそうなアイコンではないでしょうか?笑シンプルな表現なのでどんなロゴにも合いそうな形ですね。変えるだけでもっと丸くしたりできるので使い勝手が良いです。:Illustratorアイコンデザインこの記事を書いた人Higemura高卒フロントエンジニア高校卒業後にHTMLやCSSなどから独学で勉強していき、高卒FE(フロントエンジニア)として都内でフリーランスで活動中。高卒でもWebエンジニアとして活躍できることを証明する為、初心者でもわかりやすいWeb制作ノウハウを発信しています。コメントをキャンセルメールアドレスが公開されることはありません。作成手順1:長方形ツールで四角形のシェイプを作成2:角丸四角形を作ろう3:エンボスローブで膨張させよう4:ワープオプションのカーブ率を変えてみよう完成サイト管理人Higemura高卒FE(フロントエンジニア)独学でWeb制作を勉強してフリーランスで活動しています。柴犬2匹飼っておりワンコについても呟いてます。