Canvaで色を変えられるオリジナルアイコンなどの素材の作り方

Canvaで色を変えられるオリジナルアイコンなどの素材の作り方

この記事は約 6 分で読めます。

 

Canvaってめっちゃ便利♪

そんな風に思っている方はきっとたくさんいると思います♪

デザイナーでも多用している方もいるくらいプロも認める便利なツールですよね!

ただ、1点どうしてもやりたいこだわりが私にはありました!

オリジナルアイコンをCanva上で色は変えられないの?

調べてもそのようなやり方を紹介してる人が見つけられず…

yuki

私が試してみてできた方法をご紹介したいと思います♪

やり方を簡単にいうと

Canva上で色を変えたい素材のファイル形式を「svg形式」にしてCanvaにアップするだけ!

 

ファイル形式?
何のことか分からない…

そんな方もきっといると思うので詳しく画像付きで説明します!

その前に…

Canvaでは5人まで月額1,500円で利用できるのでお友達と一緒に使うことで安く有料版のCanvaを使う事ができます!

共有さえしなければ一緒に利用しているお友達には制作している素材は見えません。

ぜひこの際にCanvaProを使ってみるのをおすすめします!

Contents

色を変えたいアイコン素材を用意します

もちろん自分で作れる人はオリジナル素材を作っても良いですが、時間短縮としてSVG形式でダウンロードできる素材を使うのもおすすめです!

私が良く使っているのは「ICOOON MONO」さんのシンプルなアイコン!

6000以上の優れたアイコンが揃っていてCanva以外でも、かなり良く使っています。

こちらから好きなアイコンをダウンロードします。

STEP
アイコンを検索する
Canvaで色を変えられるオリジナル素材の作り方

カテゴリで絞ったり、ピンポイントで探すならキーワードを入れたりしてアイコンを探します。

STEP
アイコンをSVG形式でダウンロードする
Canvaで色を変えられるオリジナル素材の作り方

ここで色やサイズを変えられますが、今回はCanvaでも色やサイズを変えられる素材として使用するのでそのままで「SVG」のアイコンをクリックしてダウンロードします。

※SVGのアイコンにマウスを乗せると画像のように水色になります

Canvaで色を変えられるオリジナル素材の作り方

Chromeを使っている方は、ダウンロードが終わると左下にダウンロードしたファイル名が表示されていると思います。

これで素材の準備は整いました!

STEP
Canvaに素材をアップロードする
Canvaで色を変えられるオリジナル素材の作り方

Canvaを開きます。

Canvaで色を変えられるオリジナル素材の作り方

左の項目から「すべてのフォルダ」をクリックします。

表示された画面真ん中よりやや右側にある「アップロード」をクリックします。

Canvaで色を変えられるオリジナル素材の作り方

今までにアップロードされた画像の一覧が表示されます。

右上の「アップロード」ボタンをクリックします。

小さな画面が表示されるのでアップロードしたい素材を選択して「開く」をクリックします。

Canvaで色を変えられるオリジナル素材の作り方

アップロードの一覧に素材が追加されました。

STEP
実際に使ってみよう!
Canvaで色を変えられるオリジナル素材の作り方

右上の「デザインを作成」から新しいデザインを作ります。

サイズは何でもOK!

Canvaで色を変えられるオリジナル素材の作り方

左の項目から「アップロード」をクリックします。

Canvaで色を変えられるオリジナル素材の作り方

先ほどアップロードした素材が表示されるので右側の白いステージに素材を置きます。

Canvaで色を変えられるオリジナル素材の作り方

ステージの左上(画面だと真ん中よりやや左)でグレーが表示されています。

このグレーをクリックするとおなじみのカラーパレットが表示され好きなカラーに変更ができます。

Canvaで色を変えられるオリジナル素材の作り方

葉っぱのアイコンを3つ色違いで並べてみました!

これでCanva上で色を変えられる素材が作成できました♪

ロゴマークなどオリジナル素材をCanvaで色を変えるには…

ロゴマークを持っている方の中には、背景によっては白抜きのロゴにしたり色を入れたりすることもありますよね!

そんな時はPNG形式からSVG形式に変えるサービスがあります。

こちらの変換サービスを使うことでCanvaでも色を変えられる素材にすることが可能です。

12月1日追記

GoogleのサービスでSVG変換してくれるサービス「SVGcode」が公開されたようです。

こちらもおすすめです!

注意!

無料の素材を変換する場合は、一度素材屋さんや制作者の利用規約などをご確認ください。

アイコン素材を含め無料の素材には必ず著作権があります。

PNG形式の素材をSVG形式に変換して使用しても大丈夫であるかどうかとても大切なことです。

最後に…

たまに「ゆきさんはどうしてそんな方法を思いつくの?」と聞かれることがあるのですが、私は職業病で「こんなことできないかな?」という意識をもって普段いろいろな情報を集めたり、テストしたりしています。

今まで経験してきた知識をかけ合わせて「論理上こうすればできるからこんな方法できないかな?」という試行錯誤の中で見つける内容も多かったりします。

また、「こんなのみんな知ってるよね~」と私の中で終わらせていたものも雑談で話題にしたら実は誰かの役に立ったという経験があるのでどんな当たり前な事でも発信してみようと思うようになりました。

今回のCanva上で色を変えられる素材の作り方も、もしかしたら、Canvaをコアに使っている人たちには当たり前な記事かもしれません。

でも、知らない誰かのために記事にすることにしました。

yuki

誰かのお役に立てたらとても嬉しいです♪

Canvaで色を変えられるオリジナルアイコンなどの素材の作り方

この記事が気に入ったら
いいね または フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

yukiwebのアバター yukiweb ウェブデザイナー

高校卒業後、マンガ家を目指し専門学校へ進学するも在学中にプロの厳しさに挫折を味わう。

その後、歯科助手として勤務するがパソコンでホームページ制作を覚え楽しくなってしまいウェブデザイナーへ転職。

制作会社やデザイン事務所などで、5年ほど正社員として勤務し、フリーランスへ。

携わったホームページは、アフィリエイト提供サイトや落語家のオフィシャルサイト、飲食店や建築・不動産業、楽天ECサイトなどジャンル問わず様々制作してきました。

20年以上の経験を生かし、パソコンの苦手な女性起業家さんの本気の起業をお手伝いしたく、2015年10月ごろから女性起業家さんのアメブロカスタマイズやホームページ制作を開始。

分からない、出来ないをサポートするため要望があった時のみセミナー講師も務める。
特に、ホームページ制作では、制作後のサポートも「丁寧」「分かりやすい」「親身になってくれる」と大好評。

コメント

コメントする

Contents