HTML文書内にSVGを埋め込む SVGデータのHTMLへの埋め込みは10年近く前からできましたが、当時のブラウザーではSVGはプラグインでサポートされており、<object>タグや<embed>タグを使ってページ内に埋め込んでいました。JavaScriptから制御する場合はプラグインの制限もあり、自由に制御できる状況ではありませんでした。 その後、IEを除くモダンブラウザーでは標準でSVGをサポートするようになり、プラグインなしで表示できるようになりました。IEは長らく独自のVML（Vector Markup Language）を採用していました。しかし、IE9からはSVGがサポートされ、代表的なブラウザーすべてでSVGが表示できるようになったわけです。 XHTML文書内でSVGデータを記述するには名前空間を指定しなければなりませんが、もっと手軽にSVGを利用した場合もあります。そこで、

SVGで使いやすい、折り紙でつくった感じにデザインされたアイコン素材がかわいい！ -Origami Animals

概要 文字やキャラクターのフチ。 Photoshopの範囲選択を使って、アンチエイリアスなしのアウトラインを入れる。ドット絵向き。 全部を手で描くよりかは早いはず。Photoshopであれば、アクションに登録すると便利 ※同様の機能があれば、他のソフトでも可 サンプル キャラの周りの白い枠線がアウトライン 黒い所がアウトライン。文字とか、量があるとラク アウトライン+1 1.レイヤーの透明部分を選択する 選択したとこ 自動選択で透明部分をクリックするとか、レイヤーをCtrl+クリックして反転するとか 2.選択範囲を縮小する メニュー → 選択範囲 → 選択範囲を変更 → 縮小 を選択。 縮小量は 1px でOK！ 縮小後はこんな感じ 3.選択範囲を反転する 4.新しくレイヤーを作って、 5.選択範囲を塗りつぶす 色はお好きなものを。今回は試しに紫 6.レイヤーをキャラの裏にして完成 7.お

概要 Photoshopのパターン塗りつぶしに使う、.patファイルの読み込み方法 手順 なんでもヨイので、新規作成して描ける状態にしておく。 メニューから　編集 → 塗りつぶし 使用から、パターンを選ぶ カスタムパターンの右にある▼をクリック → ギアのマークをクリック → パターンの読み込み 後は保存してある、 .pat ファイルを選択すると読み込まれて使えるようになる！！ 補足手順 .padファイルを、ウィンドウにドラッグするだけで、読み込んでくれるみたい ただ、どのバージョンからかは不明でメッセージもでない 何回もやると、一杯追加されて消すのが大変

優れたデザイン原則は、誰にでも学ぶことができ、活用することもできます。 このガイドは、デザインの現場で利用できる実用的で基本的なテクニック10個をまとめてご紹介します。これらの基本ルールを知るだけで、あなたのデザインがずっと良くなります。 ずっと使える、デザインの基本まとめました。【2020年改訂版】 プロに学ぶ、一生役立つ配色の基本ルール8個まとめ【保存版】 コンテンツ目次 1. コントラストを活用しよう。 2. 「黒に近い黒」が「黒」よりも読みやすい。 3. 重要なコンテンツを最初に。 4. すべてのものを整列させよう。 5. 文字サイズと文字スペースに気をつけよう。 6. 検索結果の順番が重要なときは「リスト表示」。 7. まずは白黒でデザイン、あとから色を追加しよう。 8. 快適なデザインを目指そう。 9. 素敵な配色カラーパレットを使おう。 10. Apple や Google