MENU

Web制作のあれこれの情報を発信提供いたします

Web制作のあれこれの情報を発信提供いたします

素敵な配色パレットサイト

August 5, 2025

<img decoding="async" src="http://chii-blog.ichigo20.com/wp-content/uploads/2025/08/chii-150x150.png" alt="" class="c-balloon__iconImg" width="80px" height="80px">

素敵な配色って難しいよね〜どう決めたらいいんだろう？

<img decoding="async" src="http://chii-blog.ichigo20.com/wp-content/uploads/2024/06/logo-150x150.png" alt="" class="c-balloon__iconImg" width="80px" height="80px">

簡単に決めれるサイトあるよ！では見てみよう♪

目次

Color Hunt

様々な配色パターン４色を提供してくれるサイト

Adobe Color

Adobe(アドビ)が提供している無料の配色サイト
直感的な操作でバランスの良い配色デザインを作り出せる
作ったカラーパレットは簡単に色コードをコピーしたりPhotoshopやIllustratorなどに自動的に送れます

あわせて読みたい

PALETTELIST

2色を選ぶと配色パレットを選び出してくれるサイト

palettelist

palettelist

Image Hues

Unsplashのランダムに選ばれた画像から4色のカラーパレットを生成できるサイト

あわせて読みたい

Image Hues Natural, fresh color palettes from random beautiful images

<img decoding="async" src="http://chii-blog.ichigo20.com/wp-content/uploads/2025/08/chii-150x150.png" alt="" class="c-balloon__iconImg" width="80px" height="80px">

へ〜〜これなら配色も簡単だね♪

<img decoding="async" src="http://chii-blog.ichigo20.com/wp-content/uploads/2024/06/logo-150x150.png" alt="" class="c-balloon__iconImg" width="80px" height="80px">

これからも色々教えるよ！

よかったら仲良くしてくださいね！

URLをコピーしました！

document.addEventListener('DOMContentLoaded', function() { const copyButtons = document.querySelectorAll('.copy-button'); copyButtons.forEach(button => { button.addEventListener('click', function() { const codeContainer = this.previousElementSibling; const code = codeContainer.textContent; navigator.clipboard.writeText(code).then(() => { this.textContent = 'Copied!'; setTimeout(() => { this.textContent = 'Copy'; }, 2000); }).catch(err => { console.error('Failed to copy text: ', err); }); }); }); });