Share color palette to make porting to other platforms easier

[ryanmiville]

I planned on porting to some of my other dev tools. Putting the color palette in the README or in a file by itself will lower the barrier of entry to port the theme.

[kevinzunigacuellar]

I've filtered the color palette from themes/houston.json into a list, hope it helps 💜

### Blues
- `#54b9ff`: Sky Blue
- `#2b7eca`: Cerulean Blue

### Greens
- `#4bf3c8`: Mint Green
- `#31c19c`: Emerald Green

### Reds and Pinks
- `#f44747`: Tomato Red
- `#ea5c00`: Burnt Orange
- `#f4587e`: Salmon Pink

### Greys and Blacks
- `#ffffff`: White
- `#cccccc`: Light Grey
- `#808080`: Grey
- `#282828`: Jet Black
- `#1e1e1e`: Dark Black
- `#2a2d34`: Charcoal Grey
- `#17191e`: Midnight Black
- `#343841`: Dark Slate Grey
- `#494949`: Dark Grey
- `#454545`: Dim Grey

### Oranges and Browns
- `#a99040`: Bronze
- `#c74e39`: Rust
- `#fbc23b`: Golden Yellow

### Yellows
- `#ffc368`: Light Amber
- `#ee931e`: Dark Tangerine

### Purples
- `#cc75f4`: Lavender Purple
- `#ad5dca`: Mauve
- `#6c3c7d`: Dark Magenta

### Blues and Greys
- `#495f77`: Steel Blue
- `#2d4860`: Dark Slate Blue

### Cyan and Teal
- `#00daef`: Turquoise
- `#23d18b`: Mint
- `#0087ff`: Electric Blue
- `#367366`: Teal

### Dark Blues
- `#004972`: Deep Blue
- `#062f4a`: Dark Blue
- `#001f33`: Dark Navy

### Others
- `#fafafa`: Snow
- `#dc3657`: Coral Red
- `#007acc`: Azure Blue
- `#0097fb`: Cerulean
- `#3399ff`: Dodger Blue
- `#24c0cf`: Light Blue
- `#17548b`: Sapphire Blue
- `#297763`: Pine Green
- `#3c3c3c`: Dark Granite

[natemoo-re]

@kevinzunigacuellar that is amazing!! Would you be willing to submit a PR that adds this as a json file to the repo and links to it in the README?

[kevinzunigacuellar]

@kevinzunigacuellar that is amazing!! Would you be willing to submit a PR that adds this as a json file to the repo and links to it in the README?

Sure! Is this format alright?

{
  "Blues": [
    {"#54b9ff": "Sky Blue"},
    {"#2b7eca": "Cerulean Blue"}
  ],
  "Greens": [
    {"#4bf3c8": "Mint Green"},
    {"#31c19c": "Emerald Green"}
  ],
  "Reds and Pinks": [
    {"#f44747": "Tomato Red"},
    {"#ea5c00": "Burnt Orange"},
    {"#f4587e": "Salmon Pink"}
  ],
  "Greys and Blacks": [
    {"#ffffff": "White"},
    {"#cccccc": "Light Grey"},
    {"#808080": "Grey"},
    {"#282828": "Jet Black"},
    {"#1e1e1e": "Dark Black"},
    {"#2a2d34": "Charcoal Grey"},
    {"#17191e": "Midnight Black"},
    {"#343841": "Dark Slate Grey"},
    {"#494949": "Dark Grey"},
    {"#454545": "Dim Grey"}
  ],
  "Oranges and Browns": [
    {"#a99040": "Bronze"},
    {"#c74e39": "Rust"},
    {"#fbc23b": "Golden Yellow"}
  ],
  "Yellows": [
    {"#ffc368": "Light Amber"},
    {"#ee931e": "Dark Tangerine"}
  ],
  "Purples": [
    {"#cc75f4": "Lavender Purple"},
    {"#ad5dca": "Mauve"},
    {"#6c3c7d": "Dark Magenta"}
  ],
  "Blues and Greys": [
    {"#495f77": "Steel Blue"},
    {"#2d4860": "Dark Slate Blue"}
  ],
  "Cyan and Teal": [
    {"#00daef": "Turquoise"},
    {"#23d18b": "Mint"},
    {"#0087ff": "Electric Blue"},
    {"#367366": "Teal"}
  ],
  "Dark Blues": [
    {"#004972": "Deep Blue"},
    {"#062f4a": "Dark Blue"},
    {"#001f33": "Dark Navy"}
  ],
  "Others": [
    {"#fafafa": "Snow"},
    {"#dc3657": "Coral Red"},
    {"#007acc": "Azure Blue"},
    {"#0097fb": "Cerulean"},
    {"#3399ff": "Dodger Blue"},
    {"#24c0cf": "Light Blue"},
    {"#17548b": "Sapphire Blue"},
    {"#297763": "Pine Green"},
    {"#3c3c3c": "Dark Granite"}
  ]
}

[delucis]

Is this format alright?

I might make the colours tuples of [hex, name]?

{
  Blues: [["#54b9ff", "Sky Blue"], ["#2b7eca", "Cerulean Blue"]],
  // ...
}

Or just make it a one-level object:

{
  sky_blue: "#54b9ff",
  cerulean_blue: "#2b7eca",
  mint_green: "#4bf3c8",
  // ...
}

Not sure what the exact use case is but I’d guess Object.keys(colors['Reds and Pinks'][0])[0] is not a convenient way to grab the hex code 😅

[natemoo-re]

Full Palette

{
  "sky_blue": "#54b9ff",
  "cerulean_blue": "#2b7eca",
  "mint_green": "#4bf3c8",
  "emerald_green": "#31c19c",
  "tomato_red": "#f44747",
  "burnt_orange": "#ea5c00",
  "salmon_pink": "#f4587e",
  "white": "#ffffff",
  "light_grey": "#cccccc",
  "grey": "#808080",
  "jet_black": "#282828",
  "dark_black": "#1e1e1e",
  "charcoal_grey": "#2a2d34",
  "midnight_black": "#17191e",
  "dark_slate_grey": "#343841",
  "dark_grey": "#494949",
  "dim_grey": "#454545",
  "bronze": "#a99040",
  "rust": "#c74e39",
  "golden_yellow": "#fbc23b",
  "light_amber": "#ffc368",
  "dark_tangerine": "#ee931e",
  "lavender_purple": "#cc75f4",
  "mauve": "#ad5dca",
  "dark_magenta": "#6c3c7d",
  "steel_blue": "#495f77",
  "dark_slate_blue": "#2d4860",
  "turquoise": "#00daef",
  "mint": "#23d18b",
  "electric_blue": "#0087ff",
  "teal": "#367366",
  "deep_blue": "#004972",
  "dark_blue": "#062f4a",
  "dark_navy": "#001f33",
  "snow": "#fafafa",
  "coral_red": "#dc3657",
  "azure_blue": "#007acc",
  "cerulean": "#0097fb",
  "dodger_blue": "#3399ff",
  "light_blue": "#24c0cf",
  "sapphire_blue": "#17548b",
  "pine_green": "#297763",
  "dark_granite": "#3c3c3c"
}

Theme (thanks for warp-houston, @kevinzunigacuellar!)

{
  "background": "#17191e",
  "foreground": "#cccccc",
  "accent": "#acafff",
  "terminal": {
    "default": {
      "black": "#17191e",
      "blue": "#54b9ff",
      "cyan": "#00daef",
      "green": "#4bf3c8",
      "magenta": "#acafff",
      "red": "#dc3657",
      "white": "#eef0f9",
      "yellow": "#ffd493"
    },
    "bright": {
      "black": "#2b2d33",
      "blue": "#79d4ff",
      "cyan": "#4be7ff",
      "green": "#6fffd9",
      "magenta": "#d7daff",
      "red": "#ff5e78",
      "white": "#f5f7ff",
      "yellow": "#ffe0aa"
    }
  }
}

[natemoo-re]

[kevinzunigacuellar]

A light theme for warp seems like a good weekend project for this week. Thanks for the awesome graphic Nate!