この色を使いたい!!colorzillaを活用しよう!!

目次

webデザインをやりたい人必須ツール!!




Googlechromeで拡張ツールで簡単に使うことができるcolorzilla

こちらを利用すると簡単にそのサイトで使用している色のコードを知ることができます。

きれいでおしゃれなサイトを作るためには必須のコードの情報を詳しく知れる、活用方法を伝授します。

CodeCampの体験レッスンうけてみました

プログラミング初めて1か月でどこまでできる??

目次

  • colorzillaのダウンロードの方法
  • colorzillaの使い方

colorzillaのダウンロードの方法

colorzillaのインストールはこちらから

colorzillaのインストールはとっても簡単。

※プラウザとしてGooglechromeを使用する必要があるので注意。

上記サイトからアクセスしてchromeに追加するだけ。

すぐに拡張機能より使用することができます。サイト右上URLの同列にスポイトが表示されるようになります。

ここからすぐに利用することが可能です。

colorzillaの使い方

radikoのサイトで試してみました。

右上のスポイトマークをクリックしてください

色を知りたいところにポインターを合わせると、中央上部に色のコードがrgbと#表記両方で表示されます。

自分のサイトのCSSで使用したいときはこちらのコードを入力するだけ。

また、同じ機能のwebpage color analyzerを使用するとそのページで使用している色について詳しく知ることができます。




是非、webサイト制作している方、模写したいサイトがある方はこちらの機能を活用してみてください。

よかったらシェアしてね!

この記事を書いた人

調剤薬局にてフルタイムの薬剤師をしながら副業でバナー&サムネイル制作、web制作&お薬相談。ココナラ売り上げ実績70件以上。個人向けblogサイト構築から美容系サロンのサイト、コーポレートサイト、ペライチサイト作成実績あり。初心者でも安心な丁寧なやり取りを心がけております。お仕事の依頼も随時受付中です。

コメント

コメントする

CAPTCHA


目次
閉じる