# How to fetch a JSON Value from external website

**URL:** <https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916>\
**Category:** Ask for Help\
**Created:** [October 8, 2024, 9:59am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916 "2024-10-08T09:59:22Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 8, 2024, 9:59am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/1 "2024-10-08T09:59:22Z")

</div>

Hi  
I’d like to fetch the hex value from a website e.g.: [https://rgb.to/save/json/ral/9001](https://rgb.to/save/json/ral/9001)

Nothing I’ve tried is working so far… 😭  
Could you please help me to set it up correctly?

Thank’s  
Alex

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [October 8, 2024, 10:15am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/2 "2024-10-08T10:15:09Z")

</div>

Fetch the JSON using Call API or JavaScript, and then extract the Hex value with a Query JSON column:

 ![CleanShot 2024-10-08 at 18.12.57@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/d/5d797e0e1adfab54457f7011518fc36406a9d4b4.png)

 ![CleanShot 2024-10-08 at 18.13.38@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/a/9/a9defb2f64f841a09c3e8a4f39ac29670c8e17fc.png)

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 8, 2024, 10:20am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/3 "2024-10-08T10:20:17Z")

</div>

> [@Darren\_Murphy](#):
>
> JavaScript

Hi Darren,  
thank’s for quick reply.  
I have the free plan so I guess API won’t work out.

all js attempts were failing so far.

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [October 8, 2024, 11:32am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/4 "2024-10-08T11:32:05Z")

</div>

```auto
const response = await fetch(p1);
const data = await response.json();
const jsonData = JSON.stringify(data);
return jsonData;

```

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 8, 2024, 12:16pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/5 "2024-10-08T12:16:04Z")

</div>

Hi Eric,  
I guess it’s not plain JSON because it shows me this syntax error.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/c/5ca5aef06a14a2dfbce97161a795accbf547818a.png)

Is there a way to fetch the JSON “inbetween the lines”?

Thank’s  
Alex

---

<div class="post-metadata">

**Author:** ![micheal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/micheal/32/80181_2.png) [@micheal](https://community.glideapps.com/u/micheal)\
**Post date:** [October 8, 2024, 7:30pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/6 "2024-10-08T19:30:05Z")

</div>

> [@Eric\_Penn](#):
>
> ```auto
> const response = await fetch(p1);
> const data = await response.json();
> const jsonData = JSON.stringify(data);
> return jsonData;
> 
> ```

does this work in the freeplan? To fetch data from an external source?

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [October 8, 2024, 8:17pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/7 "2024-10-08T20:17:58Z")

</div>

JavaScript works on all plans

---

<div class="post-metadata">

**Author:** ![micheal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/micheal/32/80181_2.png) [@micheal](https://community.glideapps.com/u/micheal)\
**Post date:** [October 8, 2024, 9:01pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/8 "2024-10-08T21:01:34Z")

</div>

yes i know but for this use case?

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [October 8, 2024, 9:42pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/9 "2024-10-08T21:42:59Z")

</div>

If it returns a value, then it works. 😉

However, the question is about security and rate limits.

- I would not recommend calling an API from a javascript column if an API key is involved, because there is nothing preventing a user of your app from inspecting the code and discovering the key. Anything in the javascript column runs client side as opposed to server side where things like API keys could be protected. I only recommend using the javascript column if you are calling public API’s without a key.
- There’s also the case of rate limits on external API’s. Depending on how the javascript column is set up, you may trigger rate limits if there isn’t anything in place to cache the responses. Multiple refreshes from multiple users on multiple devices could get you rate limited.

In comparison to Glide’s Call API functionality, the Call API runs server side to secure your API key, and also caches responses to reduce the risk of rate limiting.

PS, I did ask ChatGPT for code to mimic this same functionally instead of relying on an external API. Haven’t had a chance to play around with it much, but it wasn’t quite working yet. I would definitely encourage considering that path, because I think the code is pretty simple and shouldn’t rely on an API.

---

<div class="post-metadata">

**Author:** ![micheal](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/micheal/32/80181_2.png) [@micheal](https://community.glideapps.com/u/micheal)\
**Post date:** [October 8, 2024, 9:48pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/10 "2024-10-08T21:48:46Z")

</div>

wow I didn’t know this was possible - coool

---

<div class="post-metadata">

**Author:** ![slscustom.ru](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/slscustom.ru/32/77336_2.png) [@slscustom.ru](https://community.glideapps.com/u/slscustom.ru)\
**Post date:** [October 8, 2024, 11:35pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/11 "2024-10-08T23:35:42Z")

</div>

> [@AJ-SuD](#):
>
> [https://rgb.to/save/json/ral/9001](https://rgb.to/save/json/ral/9001)

It doesn’t work for me

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/7/47450449fe1cfba41dbc12d218c48ce655bd22a1.png)

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [October 8, 2024, 11:45pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/12 "2024-10-08T23:45:38Z")

</div>

This in a javascript column should give the same or similar result.  
Just pass your hex code as the p1 parameter. No need for calling an API.

```auto
function hexToColorData(hex) {
  // Ensure the hex code is valid and clean it up
  const cleanHex = hex.replace('#', '').toUpperCase();
  if (cleanHex.length !== 6) {
    throw new Error('Invalid hex code');
  }

  // Convert hex to RGB
  const r = parseInt(cleanHex.substring(0, 2), 16);
  const g = parseInt(cleanHex.substring(2, 4), 16);
  const b = parseInt(cleanHex.substring(4, 6), 16);

  // Convert RGB to HSL
  const { h: hslH, s: hslS, l: hslL } = rgbToHsl(r, g, b);

  // Convert RGB to HSB (also known as HSV)
  const { h: hsbH, s: hsbS, b: hsbB } = rgbToHsb(r, g, b);

  // Convert RGB to CMYK
  const { c, m, y, k } = rgbToCmyk(r, g, b);

  // Calculate the closest web-safe color
  const webSafe = toWebSafe(r, g, b);

  return {
    hex: `#${cleanHex}`,
    websafe: webSafe,
    rgb: { r, g, b },
    hsl: { h: Math.round(hslH), s: Math.round(hslS), l: Math.round(hslL) },
    hsb: { h: Math.round(hsbH), s: Math.round(hsbS), b: Math.round(hsbB) },
    cmyk: { c: Math.round(c), m: Math.round(m), y: Math.round(y), k: Math.round(k) }
  };
}

function rgbToHsl(r, g, b) {
  r /= 255;
  g /= 255;
  b /= 255;
  const max = Math.max(r, g, b);
  const min = Math.min(r, g, b);
  let h, s, l = (max + min) / 2;

  if (max === min) {
    h = s = 0;
  } else {
    const d = max - min;
    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
    switch (max) {
      case r: h = (g - b) / d + (g < b ? 6 : 0); break;
      case g: h = (b - r) / d + 2; break;
      case b: h = (r - g) / d + 4; break;
    }
    h /= 6;
  }

  return { h: h * 360, s: s * 100, l: l * 100 };
}

function rgbToHsb(r, g, b) {
  const max = Math.max(r, g, b);
  const min = Math.min(r, g, b);
  const delta = max - min;
  const brightness = max / 255;
  const saturation = max === 0 ? 0 : (delta / max);
  let hue = 0;

  if (delta !== 0) {
    switch (max) {
      case r: hue = ((g - b) / delta) % 6; break;
      case g: hue = (b - r) / delta + 2; break;
      case b: hue = (r - g) / delta + 4; break;
    }
    hue *= 60;
    if (hue < 0) hue += 360;
  }

  return { h: hue, s: saturation * 100, b: brightness * 100 };
}

function rgbToCmyk(r, g, b) {
  const rPrime = r / 255;
  const gPrime = g / 255;
  const bPrime = b / 255;

  const k = 1 - Math.max(rPrime, gPrime, bPrime);
  const c = (1 - rPrime - k) / (1 - k) || 0;
  const m = (1 - gPrime - k) / (1 - k) || 0;
  const y = (1 - bPrime - k) / (1 - k) || 0;

  return { c: c * 100, m: m * 100, y: y * 100, k: k * 100 };
}

function toWebSafe(r, g, b) {
  const safeR = Math.round(r / 51) * 51;
  const safeG = Math.round(g / 51) * 51;
  const safeB = Math.round(b / 51) * 51;
  return `#${((1 << 24) | (safeR << 16) | (safeG << 8) | safeB).toString(16).slice(1)}`;
}

// Example usage:
return JSON.stringify(hexToColorData(p1));

```

I seem to get all the same results with the exception of cmyk, which appears to be different. Not sure if that matters or not.

```auto
{
   "hex":"#E9E0D2",
   "websafe":"#ffcccc",
   "rgb":{
      "r":233,
      "g":224,
      "b":210
   },
   "hsl":{
      "h":37,
      "s":34,
      "l":87
   },
   "hsb":{
      "h":37,
      "s":10,
      "b":91
   },
   "cmyk":{
      "c":0,
      "m":4,
      "y":10,
      "k":9
   }
}

```

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 8, 2024, 11:59pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/13 "2024-10-08T23:59:03Z")

</div>

Hi Jeff,  
nice work but in my case it wouldn’t help me because I need RAL , Pantone and hks converted to hex.

Thank’s  
Alex

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [October 9, 2024, 12:10am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/14 "2024-10-09T00:10:10Z")

</div>

Yeah, I think I’m coming to that conclusion. I missed the part about RAL.  
Doing some quick reading, it appears that RAL to HEX requires a conversion chart.

So let me ask this. Is your only goal to get a Hex value, given a RAL value? I think a simple conversion chart in some javascript will work.

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [October 9, 2024, 12:28am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/15 "2024-10-09T00:28:23Z")

</div>

This is long, so apologies, but paste this in a javascript column.

```auto
const ralColors = {
    "1000":{
        "code":"1000",
        "name":"Green beige",
        "rgb":"205-186-136",
        "hex":"#CDBA88"
    },
    "1001":{
        "code":"1001",
        "name":"Beige",
        "rgb":"208-176-132",
        "hex":"#D0B084"
    },
    "1002":{
        "code":"1002",
        "name":"Sand yellow",
        "rgb":"210-170-109",
        "hex":"#D2AA6D"
    },
    "1003":{
        "code":"1003",
        "name":"Signal yellow",
        "rgb":"249-168-0",
        "hex":"#F9A800"
    },
    "1004":{
        "code":"1004",
        "name":"Golden yellow",
        "rgb":"228-158-0",
        "hex":"#E49E00"
    },
    "1005":{
        "code":"1005",
        "name":"Honey yellow",
        "rgb":"203-142-0",
        "hex":"#CB8E00"
    },
    "1006":{
        "code":"1006",
        "name":"Maize yellow",
        "rgb":"226-144-0",
        "hex":"#E29000"
    },
    "1007":{
        "code":"1007",
        "name":"Daffodil yellow",
        "rgb":"232-140-0",
        "hex":"#E88C00"
    },
    "1011":{
        "code":"1011",
        "name":"Brown beige",
        "rgb":"175-128-79",
        "hex":"#AF804F"
    },
    "1012":{
        "code":"1012",
        "name":"Lemon yellow",
        "rgb":"221-175-39",
        "hex":"#DDAF27"
    },
    "1013":{
        "code":"1013",
        "name":"Oyster white",
        "rgb":"227-217-198",
        "hex":"#E3D9C6"
    },
    "1014":{
        "code":"1014",
        "name":"Ivory",
        "rgb":"221-196-154",
        "hex":"#DDC49A"
    },
    "1015":{
        "code":"1015",
        "name":"Light ivory",
        "rgb":"230-210-181",
        "hex":"#E6D2B5"
    },
    "1016":{
        "code":"1016",
        "name":"Sulfur yellow",
        "rgb":"241-221-56",
        "hex":"#F1DD38"
    },
    "1017":{
        "code":"1017",
        "name":"Saffron yellow",
        "rgb":"246-169-80",
        "hex":"#F6A950"
    },
    "1018":{
        "code":"1018",
        "name":"Zinc yellow",
        "rgb":"250-202-48",
        "hex":"#FACA30"
    },
    "1019":{
        "code":"1019",
        "name":"Grey beige",
        "rgb":"164-143-122",
        "hex":"#A48F7A"
    },
    "1020":{
        "code":"1020",
        "name":"Olive yellow",
        "rgb":"160-143-101",
        "hex":"#A08F65"
    },
    "1021":{
        "code":"1021",
        "name":"Colza yellow",
        "rgb":"246-182-0",
        "hex":"#F6B600"
    },
    "1023":{
        "code":"1023",
        "name":"Traffic yellow",
        "rgb":"247-181-0",
        "hex":"#F7B500"
    },
    "1024":{
        "code":"1024",
        "name":"Ochre yellow",
        "rgb":"186-143-76",
        "hex":"#BA8F4C"
    },
    "1026":{
        "code":"1026",
        "name":"Luminous yellow",
        "rgb":"255-255-0",
        "hex":"#FFFF00"
    },
    "1027":{
        "code":"1027",
        "name":"Curry",
        "rgb":"167-127-14",
        "hex":"#A77F0E"
    },
    "1028":{
        "code":"1028",
        "name":"Melon yellow",
        "rgb":"255-155-0",
        "hex":"#FF9B00"
    },
    "1032":{
        "code":"1032",
        "name":"Broom yellow",
        "rgb":"226-163-0",
        "hex":"#E2A300"
    },
    "1033":{
        "code":"1033",
        "name":"Dahlia yellow",
        "rgb":"249-154-28",
        "hex":"#F99A1C"
    },
    "1034":{
        "code":"1034",
        "name":"Pastel yellow",
        "rgb":"235-156-82",
        "hex":"#EB9C52"
    },
    "1035":{
        "code":"1035",
        "name":"Pearl beige",
        "rgb":"144-131-112",
        "hex":"#908370"
    },
    "1036":{
        "code":"1036",
        "name":"Pearl gold",
        "rgb":"128-100-63",
        "hex":"#80643F"
    },
    "1037":{
        "code":"1037",
        "name":"Sun yellow",
        "rgb":"240-146-0",
        "hex":"#F09200"
    },
    "2000":{
        "code":"2000",
        "name":"Yellow orange",
        "rgb":"218-110-0",
        "hex":"#DA6E00"
    },
    "2001":{
        "code":"2001",
        "name":"Red orange",
        "rgb":"186-72-27",
        "hex":"#BA481B"
    },
    "2002":{
        "code":"2002",
        "name":"Vermilion",
        "rgb":"191-57-34",
        "hex":"#BF3922"
    },
    "2003":{
        "code":"2003",
        "name":"Pastel orange",
        "rgb":"246-120-40",
        "hex":"#F67828"
    },
    "2004":{
        "code":"2004",
        "name":"Pure orange",
        "rgb":"226-83-3",
        "hex":"#E25303"
    },
    "2005":{
        "code":"2005",
        "name":"Luminous orange",
        "rgb":"255-77-6",
        "hex":"#FF4D06"
    },
    "2007":{
        "code":"2007",
        "name":"Luminous bright orange",
        "rgb":"255-178-0",
        "hex":"#FFB200"
    },
    "2008":{
        "code":"2008",
        "name":"Bright red orange",
        "rgb":"237-107-33",
        "hex":"#ED6B21"
    },
    "2009":{
        "code":"2009",
        "name":"Traffic orange",
        "rgb":"222-83-7",
        "hex":"#DE5307"
    },
    "2010":{
        "code":"2010",
        "name":"Signal orange",
        "rgb":"208-93-40",
        "hex":"#D05D28"
    },
    "2011":{
        "code":"2011",
        "name":"Deep orange",
        "rgb":"226-110-14",
        "hex":"#E26E0E"
    },
    "2012":{
        "code":"2012",
        "name":"Salmon orange",
        "rgb":"213-101-77",
        "hex":"#D5654D"
    },
    "2013":{
        "code":"2013",
        "name":"Pearl orange",
        "rgb":"146-62-37",
        "hex":"#923E25"
    },
    "3000":{
        "code":"3000",
        "name":"Flame red",
        "rgb":"167-41-32",
        "hex":"#A72920"
    },
    "3001":{
        "code":"3001",
        "name":"Signal red",
        "rgb":"155-36-35",
        "hex":"#9B2423"
    },
    "3002":{
        "code":"3002",
        "name":"Carmine red",
        "rgb":"155-35-33",
        "hex":"#9B2321"
    },
    "3003":{
        "code":"3003",
        "name":"Ruby red",
        "rgb":"134-26-34",
        "hex":"#861A22"
    },
    "3004":{
        "code":"3004",
        "name":"Purple red",
        "rgb":"107-28-35",
        "hex":"#6B1C23"
    },
    "3005":{
        "code":"3005",
        "name":"Wine red",
        "rgb":"89-25-31",
        "hex":"#59191F"
    },
    "3007":{
        "code":"3007",
        "name":"Black red",
        "rgb":"62-32-34",
        "hex":"#3E2022"
    },
    "3009":{
        "code":"3009",
        "name":"Oxide red",
        "rgb":"109-52-45",
        "hex":"#6D342D"
    },
    "3011":{
        "code":"3011",
        "name":"Brown red",
        "rgb":"121-36-35",
        "hex":"#792423"
    },
    "3012":{
        "code":"3012",
        "name":"Beige red",
        "rgb":"198-132-109",
        "hex":"#C6846D"
    },
    "3013":{
        "code":"3013",
        "name":"Tomato red",
        "rgb":"151-46-37",
        "hex":"#972E25"
    },
    "3014":{
        "code":"3014",
        "name":"Antique pink",
        "rgb":"203-115-117",
        "hex":"#CB7375"
    },
    "3015":{
        "code":"3015",
        "name":"Light pink",
        "rgb":"216-160-166",
        "hex":"#D8A0A6"
    },
    "3016":{
        "code":"3016",
        "name":"Coral red",
        "rgb":"166-61-47",
        "hex":"#A63D2F"
    },
    "3017":{
        "code":"3017",
        "name":"Rose",
        "rgb":"203-85-93",
        "hex":"#CB555D"
    },
    "3018":{
        "code":"3018",
        "name":"Strawberry red",
        "rgb":"199-63-74",
        "hex":"#C73F4A"
    },
    "3020":{
        "code":"3020",
        "name":"Traffic red",
        "rgb":"187-30-16",
        "hex":"#BB1E10"
    },
    "3022":{
        "code":"3022",
        "name":"Salmon pink",
        "rgb":"207-105-85",
        "hex":"#CF6955"
    },
    "3024":{
        "code":"3024",
        "name":"Luminous red",
        "rgb":"255-45-33",
        "hex":"#FF2D21"
    },
    "3026":{
        "code":"3026",
        "name":"Luminous bright red",
        "rgb":"255-42-27",
        "hex":"#FF2A1B"
    },
    "3027":{
        "code":"3027",
        "name":"Raspberry red",
        "rgb":"171-39-60",
        "hex":"#AB273C"
    },
    "3028":{
        "code":"3028",
        "name":"Pure red",
        "rgb":"204-44-36",
        "hex":"#CC2C24"
    },
    "3031":{
        "code":"3031",
        "name":"Orient red",
        "rgb":"166-52-55",
        "hex":"#A63437"
    },
    "3032":{
        "code":"3032",
        "name":"Pearl ruby red",
        "rgb":"112-29-35",
        "hex":"#701D23"
    },
    "3033":{
        "code":"3033",
        "name":"Pearl pink",
        "rgb":"165-58-45",
        "hex":"#A53A2D"
    },
    "4001":{
        "code":"4001",
        "name":"Red lilac",
        "rgb":"129-97-131",
        "hex":"#816183"
    },
    "4002":{
        "code":"4002",
        "name":"Red violet",
        "rgb":"141-60-75",
        "hex":"#8D3C4B"
    },
    "4003":{
        "code":"4003",
        "name":"Heather violet",
        "rgb":"196-97-140",
        "hex":"#C4618C"
    },
    "4004":{
        "code":"4004",
        "name":"Claret violet",
        "rgb":"101-30-56",
        "hex":"#651E38"
    },
    "4005":{
        "code":"4005",
        "name":"Blue lilac",
        "rgb":"118-104-154",
        "hex":"#76689A"
    },
    "4006":{
        "code":"4006",
        "name":"Traffic purple",
        "rgb":"144-51-115",
        "hex":"#903373"
    },
    "4007":{
        "code":"4007",
        "name":"Purple violet",
        "rgb":"71-36-60",
        "hex":"#47243C"
    },
    "4008":{
        "code":"4008",
        "name":"Signal violet",
        "rgb":"132-76-130",
        "hex":"#844C82"
    },
    "4009":{
        "code":"4009",
        "name":"Pastel violet",
        "rgb":"157-134-146",
        "hex":"#9D8692"
    },
    "4010":{
        "code":"4010",
        "name":"Telemagenta",
        "rgb":"188-64-119",
        "hex":"#BC4077"
    },
    "4011":{
        "code":"4011",
        "name":"Pearl violet",
        "rgb":"110-99-135",
        "hex":"#6E6387"
    },
    "4012":{
        "code":"4012",
        "name":"Pearl blackberry",
        "rgb":"107-107-127",
        "hex":"#6B6B7F"
    },
    "5000":{
        "code":"5000",
        "name":"Violet blue",
        "rgb":"49-79-111",
        "hex":"#314F6F"
    },
    "5001":{
        "code":"5001",
        "name":"Green blue",
        "rgb":"15-76-100",
        "hex":"#0F4C64"
    },
    "5002":{
        "code":"5002",
        "name":"Ultramarine blue",
        "rgb":"0-56-123",
        "hex":"#00387B"
    },
    "5003":{
        "code":"5003",
        "name":"Sapphire blue",
        "rgb":"31-56-85",
        "hex":"#1F3855"
    },
    "5004":{
        "code":"5004",
        "name":"Black blue",
        "rgb":"25-30-40",
        "hex":"#191E28"
    },
    "5005":{
        "code":"5005",
        "name":"Signal blue",
        "rgb":"0-83-135",
        "hex":"#005387"
    },
    "5007":{
        "code":"5007",
        "name":"Brilliant blue",
        "rgb":"55-107-140",
        "hex":"#376B8C"
    },
    "5008":{
        "code":"5008",
        "name":"Grey blue",
        "rgb":"43-58-68",
        "hex":"#2B3A44"
    },
    "5009":{
        "code":"5009",
        "name":"Azure blue",
        "rgb":"34-95-120",
        "hex":"#225F78"
    },
    "5010":{
        "code":"5010",
        "name":"Gentian blue",
        "rgb":"0-79-124",
        "hex":"#004F7C"
    },
    "5011":{
        "code":"5011",
        "name":"Steel blue",
        "rgb":"26-43-60",
        "hex":"#1A2B3C"
    },
    "5012":{
        "code":"5012",
        "name":"Light blue",
        "rgb":"0-137-182",
        "hex":"#0089B6"
    },
    "5013":{
        "code":"5013",
        "name":"Cobalt blue",
        "rgb":"25-49-83",
        "hex":"#193153"
    },
    "5014":{
        "code":"5014",
        "name":"Pigeon blue",
        "rgb":"99-125-150",
        "hex":"#637D96"
    },
    "5015":{
        "code":"5015",
        "name":"Sky blue",
        "rgb":"0-124-176",
        "hex":"#007CB0"
    },
    "5017":{
        "code":"5017",
        "name":"Traffic blue",
        "rgb":"0-91-140",
        "hex":"#005B8C"
    },
    "5018":{
        "code":"5018",
        "name":"Turquoise blue",
        "rgb":"5-139-140",
        "hex":"#058B8C"
    },
    "5019":{
        "code":"5019",
        "name":"Capri blue",
        "rgb":"0-94-131",
        "hex":"#005E83"
    },
    "5020":{
        "code":"5020",
        "name":"Ocean blue",
        "rgb":"0-65-75",
        "hex":"#00414B"
    },
    "5021":{
        "code":"5021",
        "name":"Water blue",
        "rgb":"0-117-119",
        "hex":"#007577"
    },
    "5022":{
        "code":"5022",
        "name":"Night blue",
        "rgb":"34-45-90",
        "hex":"#222D5A"
    },
    "5023":{
        "code":"5023",
        "name":"Distant blue",
        "rgb":"66-105-140",
        "hex":"#42698C"
    },
    "5024":{
        "code":"5024",
        "name":"Pastel blue",
        "rgb":"96-147-172",
        "hex":"#6093AC"
    },
    "5025":{
        "code":"5025",
        "name":"Pearl gentian blue",
        "rgb":"33-105-124",
        "hex":"#21697C"
    },
    "5026":{
        "code":"5026",
        "name":"Pearl night blue",
        "rgb":"15-48-82",
        "hex":"#0F3052"
    },
    "6000":{
        "code":"6000",
        "name":"Patina green",
        "rgb":"60-116-96",
        "hex":"#3C7460"
    },
    "6001":{
        "code":"6001",
        "name":"Emerald green",
        "rgb":"54-103-53",
        "hex":"#366735"
    },
    "6002":{
        "code":"6002",
        "name":"Leaf green",
        "rgb":"50-89-40",
        "hex":"#325928"
    },
    "6003":{
        "code":"6003",
        "name":"Olive green",
        "rgb":"80-83-60",
        "hex":"#50533C"
    },
    "6004":{
        "code":"6004",
        "name":"Blue green",
        "rgb":"2-68-66",
        "hex":"#024442"
    },
    "6005":{
        "code":"6005",
        "name":"Moss green",
        "rgb":"17-66-50",
        "hex":"#114232"
    },
    "6006":{
        "code":"6006",
        "name":"Grey olive",
        "rgb":"60-57-46",
        "hex":"#3C392E"
    },
    "6007":{
        "code":"6007",
        "name":"Bottle green",
        "rgb":"44-50-34",
        "hex":"#2C3222"
    },
    "6008":{
        "code":"6008",
        "name":"Brown green",
        "rgb":"55-52-42",
        "hex":"#37342A"
    },
    "6009":{
        "code":"6009",
        "name":"Fir green",
        "rgb":"39-53-42",
        "hex":"#27352A"
    },
    "6010":{
        "code":"6010",
        "name":"Grass green",
        "rgb":"77-111-57",
        "hex":"#4D6F39"
    },
    "6011":{
        "code":"6011",
        "name":"Reseda green",
        "rgb":"108-124-89",
        "hex":"#6C7C59"
    },
    "6012":{
        "code":"6012",
        "name":"Black green",
        "rgb":"48-61-58",
        "hex":"#303D3A"
    },
    "6013":{
        "code":"6013",
        "name":"Reed green",
        "rgb":"125-118-90",
        "hex":"#7D765A"
    },
    "6014":{
        "code":"6014",
        "name":"Yellow olive",
        "rgb":"71-65-53",
        "hex":"#474135"
    },
    "6015":{
        "code":"6015",
        "name":"Black olive",
        "rgb":"61-61-54",
        "hex":"#3D3D36"
    },
    "6016":{
        "code":"6016",
        "name":"Turquoise green",
        "rgb":"0-105-76",
        "hex":"#00694C"
    },
    "6017":{
        "code":"6017",
        "name":"May green",
        "rgb":"88-127-64",
        "hex":"#587F40"
    },
    "6018":{
        "code":"6018",
        "name":"Yellow green",
        "rgb":"97-153-59",
        "hex":"#61993B"
    },
    "6019":{
        "code":"6019",
        "name":"Pastel green",
        "rgb":"185-206-172",
        "hex":"#B9CEAC"
    },
    "6020":{
        "code":"6020",
        "name":"Chrome green",
        "rgb":"55-66-47",
        "hex":"#37422F"
    },
    "6021":{
        "code":"6021",
        "name":"Pale green",
        "rgb":"138-153-119",
        "hex":"#8A9977"
    },
    "6022":{
        "code":"6022",
        "name":"Olive drab",
        "rgb":"58-51-39",
        "hex":"#3A3327"
    },
    "6024":{
        "code":"6024",
        "name":"Traffic green",
        "rgb":"0-131-81",
        "hex":"#008351"
    },
    "6025":{
        "code":"6025",
        "name":"Fern green",
        "rgb":"94-110-59",
        "hex":"#5E6E3B"
    },
    "6026":{
        "code":"6026",
        "name":"Opal green",
        "rgb":"0-95-78",
        "hex":"#005F4E"
    },
    "6027":{
        "code":"6027",
        "name":"Light green",
        "rgb":"126-186-181",
        "hex":"#7EBAB5"
    },
    "6028":{
        "code":"6028",
        "name":"Pine green",
        "rgb":"49-84-66",
        "hex":"#315442"
    },
    "6029":{
        "code":"6029",
        "name":"Mint green",
        "rgb":"0-111-61",
        "hex":"#006F3D"
    },
    "6032":{
        "code":"6032",
        "name":"Signal green",
        "rgb":"35-127-82",
        "hex":"#237F52"
    },
    "6033":{
        "code":"6033",
        "name":"Mint turquoise",
        "rgb":"70-135-127",
        "hex":"#46877F"
    },
    "6034":{
        "code":"6034",
        "name":"Pastel turquoise",
        "rgb":"122-172-172",
        "hex":"#7AACAC"
    },
    "6035":{
        "code":"6035",
        "name":"Pearl green",
        "rgb":"25-77-37",
        "hex":"#194D25"
    },
    "6036":{
        "code":"6036",
        "name":"Pearl opal green",
        "rgb":"4-87-75",
        "hex":"#04574B"
    },
    "6037":{
        "code":"6037",
        "name":"Pure green",
        "rgb":"0-139-41",
        "hex":"#008B29"
    },
    "6038":{
        "code":"6038",
        "name":"Luminous green",
        "rgb":"0-181-26",
        "hex":"#00B51A"
    },
    "7000":{
        "code":"7000",
        "name":"Squirrel grey",
        "rgb":"122-136-142",
        "hex":"#7A888E"
    },
    "7001":{
        "code":"7001",
        "name":"Silver grey",
        "rgb":"140-150-157",
        "hex":"#8C969D"
    },
    "7002":{
        "code":"7002",
        "name":"Olive grey",
        "rgb":"129-120-99",
        "hex":"#817863"
    },
    "7003":{
        "code":"7003",
        "name":"Moss grey",
        "rgb":"122-118-105",
        "hex":"#7A7669"
    },
    "7004":{
        "code":"7004",
        "name":"Signal grey",
        "rgb":"155-155-155",
        "hex":"#9B9B9B"
    },
    "7005":{
        "code":"7005",
        "name":"Mouse grey",
        "rgb":"108-110-107",
        "hex":"#6C6E6B"
    },
    "7006":{
        "code":"7006",
        "name":"Beige grey",
        "rgb":"118-106-94",
        "hex":"#766A5E"
    },
    "7008":{
        "code":"7008",
        "name":"Khaki grey",
        "rgb":"116-94-61",
        "hex":"#745E3D"
    },
    "7009":{
        "code":"7009",
        "name":"Green grey",
        "rgb":"93-96-88",
        "hex":"#5D6058"
    },
    "7010":{
        "code":"7010",
        "name":"Tarpaulin grey",
        "rgb":"88-92-86",
        "hex":"#585C56"
    },
    "7011":{
        "code":"7011",
        "name":"Iron grey",
        "rgb":"82-89-93",
        "hex":"#52595D"
    },
    "7012":{
        "code":"7012",
        "name":"Basalt grey",
        "rgb":"87-93-94",
        "hex":"#575D5E"
    },
    "7013":{
        "code":"7013",
        "name":"Brown grey",
        "rgb":"87-80-68",
        "hex":"#575044"
    },
    "7015":{
        "code":"7015",
        "name":"Slate grey",
        "rgb":"79-83-88",
        "hex":"#4F5358"
    },
    "7016":{
        "code":"7016",
        "name":"Anthracite grey",
        "rgb":"56-62-66",
        "hex":"#383E42"
    },
    "7021":{
        "code":"7021",
        "name":"Black grey",
        "rgb":"47-50-52",
        "hex":"#2F3234"
    },
    "7022":{
        "code":"7022",
        "name":"Umbra grey",
        "rgb":"76-74-68",
        "hex":"#4C4A44"
    },
    "7023":{
        "code":"7023",
        "name":"Concrete grey",
        "rgb":"128-128-118",
        "hex":"#808076"
    },
    "7024":{
        "code":"7024",
        "name":"Graphite grey",
        "rgb":"69-73-78",
        "hex":"#45494E"
    },
    "7026":{
        "code":"7026",
        "name":"Granite grey",
        "rgb":"55-67-69",
        "hex":"#374345"
    },
    "7030":{
        "code":"7030",
        "name":"Stone grey",
        "rgb":"146-142-133",
        "hex":"#928E85"
    },
    "7031":{
        "code":"7031",
        "name":"Blue grey",
        "rgb":"91-104-109",
        "hex":"#5B686D"
    },
    "7032":{
        "code":"7032",
        "name":"Pebble grey",
        "rgb":"181-176-161",
        "hex":"#B5B0A1"
    },
    "7033":{
        "code":"7033",
        "name":"Cement grey",
        "rgb":"127-130-116",
        "hex":"#7F8274"
    },
    "7034":{
        "code":"7034",
        "name":"Yellow grey",
        "rgb":"146-136-111",
        "hex":"#92886F"
    },
    "7035":{
        "code":"7035",
        "name":"Light grey",
        "rgb":"197-199-196",
        "hex":"#C5C7C4"
    },
    "7036":{
        "code":"7036",
        "name":"Platinum grey",
        "rgb":"151-147-146",
        "hex":"#979392"
    },
    "7037":{
        "code":"7037",
        "name":"Dusty grey",
        "rgb":"122-123-122",
        "hex":"#7A7B7A"
    },
    "7038":{
        "code":"7038",
        "name":"Agate grey",
        "rgb":"176-176-169",
        "hex":"#B0B0A9"
    },
    "7039":{
        "code":"7039",
        "name":"Quartz grey",
        "rgb":"107-102-94",
        "hex":"#6B665E"
    },
    "7040":{
        "code":"7040",
        "name":"Window grey",
        "rgb":"152-158-161",
        "hex":"#989EA1"
    },
    "7042":{
        "code":"7042",
        "name":"Traffic grey A",
        "rgb":"142-146-145",
        "hex":"#8E9291"
    },
    "7043":{
        "code":"7043",
        "name":"Traffic grey B",
        "rgb":"79-82-80",
        "hex":"#4F5250"
    },
    "7044":{
        "code":"7044",
        "name":"Silk grey",
        "rgb":"183-179-168",
        "hex":"#B7B3A8"
    },
    "7045":{
        "code":"7045",
        "name":"Telegrey 1",
        "rgb":"141-146-149",
        "hex":"#8D9295"
    },
    "7046":{
        "code":"7046",
        "name":"Telegrey 2",
        "rgb":"127-134-138",
        "hex":"#7F868A"
    },
    "7047":{
        "code":"7047",
        "name":"Telegrey 4",
        "rgb":"200-200-199",
        "hex":"#C8C8C7"
    },
    "7048":{
        "code":"7048",
        "name":"Pearl mouse grey",
        "rgb":"129-123-115",
        "hex":"#817B73"
    },
    "8000":{
        "code":"8000",
        "name":"Green brown",
        "rgb":"137-105-62",
        "hex":"#89693E"
    },
    "8001":{
        "code":"8001",
        "name":"Ochre brown",
        "rgb":"157-98-43",
        "hex":"#9D622B"
    },
    "8002":{
        "code":"8002",
        "name":"Signal brown",
        "rgb":"121-77-62",
        "hex":"#794D3E"
    },
    "8003":{
        "code":"8003",
        "name":"Clay brown",
        "rgb":"126-75-38",
        "hex":"#7E4B26"
    },
    "8004":{
        "code":"8004",
        "name":"Copper brown",
        "rgb":"141-73-49",
        "hex":"#8D4931"
    },
    "8007":{
        "code":"8007",
        "name":"Fawn brown",
        "rgb":"112-69-42",
        "hex":"#70452A"
    },
    "8008":{
        "code":"8008",
        "name":"Olive brown",
        "rgb":"114-74-37",
        "hex":"#724A25"
    },
    "8011":{
        "code":"8011",
        "name":"Nut brown",
        "rgb":"90-56-38",
        "hex":"#5A3826"
    },
    "8012":{
        "code":"8012",
        "name":"Red brown",
        "rgb":"102-51-43",
        "hex":"#66332B"
    },
    "8014":{
        "code":"8014",
        "name":"Sepia brown",
        "rgb":"74-53-38",
        "hex":"#4A3526"
    },
    "8015":{
        "code":"8015",
        "name":"Chestnut brown",
        "rgb":"94-47-38",
        "hex":"#5E2F26"
    },
    "8016":{
        "code":"8016",
        "name":"Mahogany brown",
        "rgb":"76-43-32",
        "hex":"#4C2B20"
    },
    "8017":{
        "code":"8017",
        "name":"Chocolate brown",
        "rgb":"68-47-41",
        "hex":"#442F29"
    },
    "8019":{
        "code":"8019",
        "name":"Grey brown",
        "rgb":"61-54-53",
        "hex":"#3D3635"
    },
    "8022":{
        "code":"8022",
        "name":"Black brown",
        "rgb":"26-23-24",
        "hex":"#1A1718"
    },
    "8023":{
        "code":"8023",
        "name":"Orange brown",
        "rgb":"164-87-41",
        "hex":"#A45729"
    },
    "8024":{
        "code":"8024",
        "name":"Beige brown",
        "rgb":"121-80-56",
        "hex":"#795038"
    },
    "8025":{
        "code":"8025",
        "name":"Pale brown",
        "rgb":"117-88-71",
        "hex":"#755847"
    },
    "8028":{
        "code":"8028",
        "name":"Terra brown",
        "rgb":"81-58-42",
        "hex":"#513A2A"
    },
    "8029":{
        "code":"8029",
        "name":"Pearl copper",
        "rgb":"127-64-49",
        "hex":"#7F4031"
    },
    "9001":{
        "code":"9001",
        "name":"Cream",
        "rgb":"233-224-210",
        "hex":"#E9E0D2"
    },
    "9002":{
        "code":"9002",
        "name":"Grey white",
        "rgb":"215-213-203",
        "hex":"#D7D5CB"
    },
    "9003":{
        "code":"9003",
        "name":"Signal white",
        "rgb":"236-236-231",
        "hex":"#ECECE7"
    },
    "9004":{
        "code":"9004",
        "name":"Signal black",
        "rgb":"43-43-44",
        "hex":"#2B2B2C"
    },
    "9005":{
        "code":"9005",
        "name":"Jet black",
        "rgb":"14-14-16",
        "hex":"#0E0E10"
    },
    "9006":{
        "code":"9006",
        "name":"White aluminium",
        "rgb":"161-161-160",
        "hex":"#A1A1A0"
    },
    "9007":{
        "code":"9007",
        "name":"Grey aluminium",
        "rgb":"135-133-129",
        "hex":"#878581"
    },
    "9010":{
        "code":"9010",
        "name":"Pure white",
        "rgb":"241-236-225",
        "hex":"#F1ECE1"
    },
    "9011":{
        "code":"9011",
        "name":"Graphite black",
        "rgb":"39-41-43",
        "hex":"#27292B"
    },
    "9016":{
        "code":"9016",
        "name":"Traffic white",
        "rgb":"241-240-234",
        "hex":"#F1F0EA"
    },
    "9017":{
        "code":"9017",
        "name":"Traffic black",
        "rgb":"42-41-42",
        "hex":"#2A292A"
    },
    "9018":{
        "code":"9018",
        "name":"Papyrus white",
        "rgb":"200-203-196",
        "hex":"#C8CBC4"
    },
    "9022":{
        "code":"9022",
        "name":"Pearl light grey",
        "rgb":"133-133-131",
        "hex":"#858583"
    },
    "9023":{
        "code":"9023",
        "name":"Pearl dark grey",
        "rgb":"121-123-122",
        "hex":"#797B7A"
    }
};

// Function to convert RAL code to hex
function getHexFromRAL(ralCode) {
    // Check if the RAL code exists in the JSON data
    const colorData = ralColors[ralCode];
    
    if (colorData) {
        return colorData.hex; // Return the hex code
    } else {
        return null; // Return null if RAL code not found
    }
}

return getHexFromRAL(p1);

```

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 9, 2024, 1:14am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/16 "2024-10-09T01:14:38Z")

</div>

Good morning  
It‘s 3am🤣 and my remote pc @work is going through updates😅

I‘ll check the codes „tomorrow“ / later. 🤪

I‘ve found an other website which offers more color spaces also in JSON formatting.

> **[Colorbase - color tools, color palettes collection, color converter, color...](https://hex-to-rgb.com/)**
>
> The most advanced color conversion tool on the web - palettes, charts and their conversion data in 11 formats, including: HEX to RGB, RAL Classic, RAL Design Plus, RAL Effect, Pantone, CMYK, HSL, HSB, NCS, WEBSAFE and vice versa.

Pantone  
blob:[https://hex-to-rgb.com/afed0c2b-cdd0-4556-b0cb-a069f760b403](https://hex-to-rgb.com/afed0c2b-cdd0-4556-b0cb-a069f760b403)

Ral Classic  
blob:[https://hex-to-rgb.com/fd489aec-f539-4e44-af38-a53697799fcf](https://hex-to-rgb.com/fd489aec-f539-4e44-af38-a53697799fcf)

Back to your question  
Yes

Thank you all so far  
Alex

---

<div class="post-metadata">

**Author:** ![Jeff\_Hager](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jeff_hager/32/43_2.png) [@Jeff\_Hager](https://community.glideapps.com/u/Jeff_Hager)\
**Post date:** [October 9, 2024, 1:53am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/17 "2024-10-09T01:53:15Z")

</div>

Looks like RAL Classic returns different Hex values compared to what rgb.to was returning, and Pantone is different altogether.

Just let me know if you need a different palette or need help incorporating it into the javascript. Should be pretty straightforward though.

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 9, 2024, 9:59am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/18 "2024-10-09T09:59:53Z")

</div>

Hi Jeff,  
I tested a bit and was able to fetch the JSON you’ve found on [**github**](https://gist.githubusercontent.com//edwinwebb/4af6edeb743156e1c89fcfb25366f9d9/raw/2389eaec3b06e01de42624b376bf596e75accc94/RalCodes.json) with @Eric_Penn JS code.

how would the JSON query look like?  
${code=“1000”}.hex is wrong… 🙂

> [@Jeff\_Hager](#):
>
> Looks like RAL Classic returns different Hex values compared to what rgb.to was returning, and Pantone is different altogether.

Yes I know, it’s only an approach caused by an input device such as a colorscanner.  
“This conversion is a challenge because of the different approaches to color between monitors and printers. Because monitors use light to display color, they use additive colors—when you add them together, they produce white. Conversely, when you remove all monitor colors you produce black. Because printers use ink to display color, they use subtractive colors—when you remove colors, you produce white, and when you add all printer colors you produce black. As a result, monitors and printers have different color gamuts. Although they share many of the same colors, there are some colors a monitor can display that a printer can’t print and some colors a printer can print that a monitor can’t display.”

> [@Jeff\_Hager](#):
>
> Just let me know if you need a different palette or need help incorporating it into the javascript. Should be pretty straightforward though.

I’ve found a better Pantone [**JSON**](https://github.com/adonald/Pantone-CMYK-RGB-Hex/blob/master/pantone_CMYK_RGB_Hex.json) palette.  
How can I adapt your Javascript solution to this new JSON layout?

I decided to store your code in a template column and trigger it when the colorsystem matches RAL with an if then else. the resulting hexcode will render an image.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/6/f6be8e3233f9b26b45fd1e82e03728bf910de7ff.png)

Thank’s  
Alex

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 10, 2024, 9:52am UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/19 "2024-10-10T09:52:19Z")

</div>

> [@AJ-SuD](#):
>
> I’ve found a better Pantone [**JSON**](https://github.com/adonald/Pantone-CMYK-RGB-Hex/blob/master/pantone_CMYK_RGB_Hex.json) palette.  
> How can I adapt your Javascript solution to this new JSON layout?

I’ve found a way:

> function findHexByCode(Code) {  
> const colors = [  
> {  
> “Code”:“Process Yellow”,  
> “C”:“0”,  
> “M”:“0”,  
> “Y”:“100”,  
> “K”:“0”,  
> “R”:“255”,  
> “G”:“255”,  
> “B”:“0”,  
> “Hex”:“#FFFF00”  
> },  
> …  
> {  
> “Code”:“100”,  
> “C”:“0”,  
> “M”:“0”,  
> “Y”:“51”,  
> “K”:“0”,  
> “R”:“255”,  
> “G”:“255”,  
> “B”:“125”,  
> “Hex”:“#FFFF7D”  
> }  
> ];  
> const color = colors.find(item =\> item.Code === Code);  
> return color ? color.Hex : null;  
> }
> 
> const hexValue = findHexByCode(p1);  
> return hexValue;

But I’m burning to know how to read from the fetched json.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/b/2b56282ac3b4dc61a8495f415800da4da9dcc197.png)  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/e/3/e3e7f7fce793d3488d6982a8f7052fecfa1ed211.png)

Thank’s  
Alex

---

<div class="post-metadata">

**Author:** ![AJ-SuD](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/aj-sud/32/87448_2.png) [@AJ-SuD](https://community.glideapps.com/u/AJ-SuD)\
**Post date:** [October 10, 2024, 2:51pm UTC](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916/20 "2024-10-10T14:51:34Z")

</div>

Hey again,  
woohoo 😍 fetching from external Website is working now for me.  
What I did…

1. created a Text(A) column called “githublink” an pasted the url [show code](https://raw.githubusercontent.com/AlexJedamzik/json/refs/heads/main/pantoneTOhex)
2. created a JavaScript column called “JS fetch from github”

- I used the JavaScript code from @Eric_Penn

```auto
const response = await fetch(p1);
const data = await response.json();
const jsonData = JSON.stringify(data);
return jsonData;

```

- p1 is pointing to (A) githublink

1. created a regular Template column called “template for JSON Query”  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/b/0be8138950e757209a6c25490187410d5a249b6a.png)
2. finaly the last Step Query the JSON  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/a/2a325c7f91d87d51c0a7bb2d9876a8852f3d0c34.png)

Now hopefuly the last question…  
what is faster and uses less resources, Jeffs or Erics method?

Thank’s  
Alex

[Next page](https://community.glideapps.com/t/how-to-fetch-a-json-value-from-external-website/76916.md?page=2)