[Vue.js]HSLA, HSV, RGBの値を出力できるカラージェネレーターを制作しました[Vuetify]

Vuetifyを使ったカラージェネレーターについて

Vue.js & Vuetifyでカラージェネレーターを制作しました

Vuetify & Vue.js を使って制作した、カラージェネレーターです。

タイトルの通り、
Vue.js & Vuetifyを使用した、カラージェネレーターを制作しました。
HSLA, RGB, 16進数のどれかの値さえわかっていれば、
各表色系に変換された値が一覧でわかります。

Vue.js & Vuetify製の
HSLA, HSV, RGBの値を出力できるカラージェネレーター 【 COLOR.tedate 】 は以下のリンクから使用できます。
HSLA, HSV, RGBの値を出力できるカラージェネレーター 【 COLOR.tedate 】
たとえば
デザインをPhotoshopで制作している時など、
HSV値(PhotoshopではHSBの表記)や
RGB値、16進数のカラーコード
はわかっているけど、

cssで指定する hsla の値がすぐに出てこなくて、
もどかしい時がありますよね。

逆の場合もそうで、
hslaや16進数のカラーコードはわかっているけど、
HSV(B)値をすぐに提示したい時や、
RGB値をすぐに計算して、共有したい時。

このジェネレーターを使えばきっと、
そんなWeb制作におけるワンシーンでの一助になってくれるかもしれません。

ボタンひとつでコピー、すぐにcssに転記もできます

出力された値は、ボタンを押せばすぐにコピーができるので、
cssで使う場合もきっと便利だと思います。
Vue.js & Vuetify製の
HSLA, HSV, RGBの値を出力できるカラージェネレーター 【 COLOR.tedate 】 は以下リンクから使用できます。
HSLA, HSV, RGBの値を出力できるカラージェネレーター 【 COLOR.tedate 】

この記事のまとめ

今回は、
Vue.js と Vuetify で制作した、HSLA, HSV, RGBの値を出力できる
カラージェネレーター
についてご紹介しました。

ぜひWeb制作の一助になれば幸いです!

この記事をシェアする: