BETA

Color Palette Generator

Create harmonious color palettes and export as Tailwind, CSS vars, or JSON

Base Color

Palette Type

Hue Shift: 0°

Saturation: 0

Lightness: 0

Generated Palette

#3BDFF6

#3B82F6

#513BF6

#3BF6AF

#AF3BF6

Click any color swatch to copy its hex value

Tailwind Config

module.exports = {
  theme: {
    extend: {
      colors: {
        'color-1': '#3bdff6',
        'color-2': '#3b82f6',...

CSS Variables

:root {
  --color-1: #3bdff6;
  --color-2: #3b82f6;
  --color-3: #513bf6;
  --color-4: #3bf6af;
  --color-5: #af3bf6;...

JSON Export

{
  "color1": {
    "hex": "#3bdff6",
    "rgb": "rgb(59, 223, 246)",
    "hsl": "hsl(187, 1%, 1%)"
  },...

Color Reference

#	HEX	RGB	HSL
1	#3BDFF6	59, 223, 246	187°, 1%, 1%
2	#3B82F6	59, 130, 246	217°, 1%, 1%
3	#513BF6	81, 59, 246	247°, 1%, 1%
4	#3BF6AF	59, 246, 175	157°, 1%, 1%
5	#AF3BF6	175, 59, 246	277°, 1%, 1%

Help & Information

Frequently Asked Questions

A quick overview of what Apptastic Coder is about, how the site works, and how you can get the most value from the content, tools, and job listings shared here.

Apptastic Coder is a developer-focused site where I share tutorials, tools, and resources around AI, web development, automation, and side projects. It’s a mix of technical deep-dives, practical how-to guides, and curated links that can help you build real-world projects faster.