サービス
サービスを探す
プロ人材を探す
仕事を探す
ブログを探す
サービス
サービスを探す
プロ人材を探す
仕事を探す
ブログを探す
購入・発注したい方
サービスを探す
プロ人材を探す
ノウハウ・素材を探す
ブログを探す
仕事・求人を投稿して募集
エージェントに人材を紹介してもらう
受注・働きたい方
出品する
単発の仕事を探す
継続 (時給/月給) の仕事を探す
エージェントに仕事を紹介してもらう
カテゴリ一覧
イラスト作成・漫画制作
デザイン制作
Web制作・HP作成・EC構築
動画編集・映像制作
集客・マーケティング相談
NEW
ビジネス代行・事務代行
音楽制作・ナレーション
IT相談・システム開発
ライティング・翻訳
コンサルティング・士業
生成AI活用・開発・制作
NEW
占い
悩み相談・カウンセリング
学習指導・資格・キャリア相談
住まい・美容・生活相談
オンラインレッスン・習い事
ハンドメイド制作
出張撮影・出張サービス
資産運用・副業の相談
NEW
弁護士検索・法律Q&A(法律相談)
サポート
はじめての方へ
ご利用ガイド
お困りのときは
ログイン
会員登録
サービスを探す
イラスト作成・漫画制作
>
デザイン制作
>
Web制作・HP作成・EC構築
>
動画編集・映像制作
>
集客・マーケティング相談
NEW
>
ビジネス代行・事務代行
>
音楽制作・ナレーション
>
IT相談・システム開発
>
ライティング・翻訳
>
コンサルティング・士業
>
生成AI活用・開発・制作
NEW
>
占い
>
悩み相談・カウンセリング
>
学習指導・資格・キャリア相談
>
住まい・美容・生活相談
>
オンラインレッスン・習い事
>
ハンドメイド制作
>
出張撮影・出張サービス
>
資産運用・副業の相談
NEW
>
>
プロ人材を探す
>
ノウハウ・素材を探す
ブログを探す
>
求人募集を投稿する
人材を紹介してもらう
仕事を探す
出品する
仕事を探す
仕事を紹介してもらう
出品する
仕事を紹介してもらう
求人募集を投稿する
人材を紹介してもらう
ブログを投稿
会員登録で10%割引クーポンを獲得!
会員登録で10%割引クーポンを獲得!
ココナラブログ
ホーム
ブログトップ
ブログ
コラム
気になる色も‼ 素敵な色も⁉ 簡単GET! オススメ拡張機能「ColorPick Eyedropper」
記事
コラム
京獅郎
2020/05/21 11:06
こんにちは、京獅郎です。
いろんなサイトやブログを閲覧していると
「
この色素敵だなぁ
」とか
「
この色使いたいなぁ
」など
思ったりしませんか?
自力で似た色を探すのは大変だと思います。
だがしかし!
それは簡単に解決するかもしれませんよ!
今回、拡張機能紹介の第3弾として、
WEB上のカラーコードを
簡単に取得できるChrome拡張機能
「
ColorPick Eyedropper
」をシェアしていきたいと思います。
WEB制作を始める方や、
ブログを始める方はもちろん、
やっていない方も
「へぇこんな事もできるんだぁ」と楽しんでいただけたらと思います。
今回の拡張機能は
超簡単に色のコードがゲットできる
ので
オススメです!
もちろん無料!
それでは今日も楽しくシェアしていきましょう!
Let's share!
※拡張機能とはなんぞや?と言う方は、
この京ブログ#14に詳しい解説を
しているのでそちらをご覧下さいね。
「ColorPick Eyedropper」追加しよう
早速「ColorPick Eyedropper」を使えるように設定していきましょう!
まずは、グーグルのブラウザを開き
①のアプリをクリック。
②のウェブストアを開く。
③の検索窓に「ColorPick Eyedropper」を入力。
これで、「ColorPick Eyedropper」が出てきます。
さぁどんどんいきましょう!
上記画像
①をクリックし、Chromeに追加。
②:ブラウザ右上の拡張機能のアイコン一覧箇所に
「ColorPick Eyedropper」のアイコンが現れれば設定完了。
これで
「ColorPick Eyedropper」を使用できます。
せっかくなので、使ってみましょう。
超簡単にカラーコードをゲット!
我らがココナラさんのトップページで使ってみましょう!
いや使わせて頂きます!
上記画像
①:先程現れたアイコンをクリック
。
②:クリック後、ウィンドウが出る。(無視します笑)
③:今回は緑枠のオレンジをゲットしていきます。
上記画像
①:今回欲しいのはオレンジなので
そのままカーソルをオレンジの上に乗せる。
②:オレンジの上でクリックすると
青枠のウインドウが出ます。
③:この数字とアルファベットをコピーします「FDA93D」
※「FDA93D」これが今回の
オレンジのカラーコードになります。
(例:白は「fff」.黒は「000」)
深く考えなくて良いです。
「これがカラーコードかぁ」ぐらいでいきましょう!
これでカラーコードがゲットできました!
次はこのカラーコードどう使うのかやってみますか!
実際に色を使ってみよう!
先程ゲットしたカラーコードを
photoshopと
WEBページを構成する言語HTML,CSSで
使ってみましょう!
まずはphotoshop。
①:白い四角の色をオレンジに変えます。
②:コピーしたカラーコードをそのまま貼り付けます。
③はい、ココナラさん帯カラー仕様に変わりました!
大変素敵な色ですね!(媚び売り)
よしよし
、次はHTML,CSS!
①:右側にある元々黒い四角を変えます。
backgroundcolorプロパティに
コピーしていたカラーコードを貼り付けます。
②:貼り付け後に更新すると
ココナラさん帯カラー仕様に変更!!
簡単っ!
色の悩みを解決!
どうでしたか?
思ったよりお手軽にカラーコードをゲットできたかと思います。
この拡張機能を使うことにより
気になる色を見つけたら、すぐチェックできるようになりますね!
それでは今日はこの辺で!
では!
■贈って使える?キャンペーン中‼
ギフトにも使えるフリーチケットをプレゼントしております!
お取引終了後、評価していただくと
次回、一回限りではございますが
無料で画像制作依頼が出来る
無料チケットをプレゼント
しております!
このチケット・・・
なんと!
依頼主様以外も使えちゃいます。
(笑)
ですので、
画像をお求めのご友人や、
お困りのお知り合いの方などにギフトとして贈ってみてはいかがでしょうか?
自分で使うのも良し!
誰かに贈るのも良し!
ぜひご活用下さいね!
なにかご不明点がございましたら
お気軽にお問い合わせ下さい。
■提供サービス一覧
https://coconala.com/services/1176506
https://coconala.com/services/1211033
https://coconala.com/services/1176597
#Google
#拡張機能
#オススメ
#カラーコード
一覧に戻る