> ## Documentation Index
> Fetch the complete documentation index at: https://docs.livepeer.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Arbitrum Exchange Reference

> List of Exchanges that support Arbitrum One - dynamically fetched from CoinGecko

export const CoinGeckoExchanges = ({coinId = "arbitrum", className = "", style = {}, ...rest}) => {
  const [exchanges, setExchanges] = useState([]);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);
  const [sortBy, setSortBy] = useState(null);
  const [sortOrder, setSortOrder] = useState("asc");
  useEffect(() => {
    const fetchExchanges = async () => {
      try {
        const response = await fetch(`https://api.coingecko.com/api/v3/coins/${coinId}/tickers?depth=true`);
        if (response.ok) {
          const data = await response.json();
          const exchangeMap = new Map();
          data.tickers?.forEach(ticker => {
            if (ticker.market?.name && ticker.trade_url) {
              if (!exchangeMap.has(ticker.market.name)) {
                exchangeMap.set(ticker.market.name, {
                  name: ticker.market.name,
                  url: ticker.trade_url,
                  trustScore: ticker.trust_score || "N/A",
                  tradingPair: ticker.base && ticker.target ? `${ticker.base}/${ticker.target}` : "N/A",
                  type: ticker.market.identifier?.includes("uniswap") || ticker.market.identifier?.includes("sushiswap") || ticker.market.identifier?.includes("pancakeswap") || ticker.market.name?.toLowerCase().includes("swap") || ticker.market.name?.toLowerCase().includes("dex") ? "DEX" : "CEX"
                });
              }
            }
          });
          const exchangeList = Array.from(exchangeMap.values());
          setExchanges(exchangeList);
        } else {
          throw new Error("Failed to fetch exchange data");
        }
      } catch (err) {
        setError("Failed to load exchange data");
        console.error("CoinGeckoExchanges error:", err);
      } finally {
        setLoading(false);
      }
    };
    fetchExchanges();
  }, [coinId]);
  if (loading) {
    return <div>Loading exchanges...</div>;
  }
  if (error) {
    return <div>Error: {error}</div>;
  }
  if (exchanges.length === 0) {
    return <div>No exchanges found for this coin.</div>;
  }
  const sortedExchanges = sortBy ? [...exchanges].sort((a, b) => {
    let comparison = 0;
    if (sortBy === "type") {
      comparison = a.type.localeCompare(b.type);
    } else if (sortBy === "name") {
      comparison = a.name.localeCompare(b.name);
    }
    return sortOrder === "asc" ? comparison : -comparison;
  }) : exchanges;
  const handleSort = column => {
    if (sortBy === column) {
      setSortOrder(sortOrder === "asc" ? "desc" : "asc");
    } else {
      setSortBy(column);
      setSortOrder("asc");
    }
  };
  const getTrustScoreColor = trustScore => {
    if (trustScore === "N/A" || trustScore === "yellow") return "var(--lp-color-status-warn)";
    if (trustScore === "green") return "var(--lp-color-status-good)";
    if (trustScore === "red") return "var(--lp-color-status-bad)";
    return "var(--lp-color-status-warn)";
  };
  return <div className={className} style={{
    overflowX: "auto",
    ...style
  }} {...rest}>
        <table style={{
    width: "100%",
    borderCollapse: "collapse",
    fontSize: "0.9rem"
  }}>
          <thead>
            <tr style={{
    backgroundColor: "var(--lp-color-accent)",
    color: "var(--lp-color-on-accent)"
  }}>
              <th style={{
    padding: "12px 16px",
    textAlign: "left",
    fontWeight: "600",
    borderBottom: "2px solid var(--lp-color-accent)",
    cursor: "pointer",
    width: "220px",
    maxWidth: "220px",
    color: "var(--lp-color-on-accent)"
  }} onClick={() => handleSort("name")} onKeyDown={e => {
    if (e.key === 'Enter' || e.key === ' ') {
      e.preventDefault();
      handleSort("name");
    }
  }} tabIndex={0} role="columnheader" aria-sort={sortBy === "name" ? sortOrder === "asc" ? "ascending" : "descending" : "none"} title="Click to sort by name">
                Exchange{" "}
                {sortBy === "name" && (sortOrder === "asc" ? "↑" : "↓")}
              </th>
              <th style={{
    padding: "12px 16px",
    textAlign: "center",
    fontWeight: "600",
    borderBottom: "2px solid var(--lp-color-accent)",
    width: "80px",
    cursor: "pointer",
    color: "var(--lp-color-on-accent)"
  }} onClick={() => handleSort("type")} onKeyDown={e => {
    if (e.key === 'Enter' || e.key === ' ') {
      e.preventDefault();
      handleSort("type");
    }
  }} tabIndex={0} role="columnheader" aria-sort={sortBy === "type" ? sortOrder === "asc" ? "ascending" : "descending" : "none"} title="Click to sort by type">
                Type {sortBy === "type" && (sortOrder === "asc" ? "↑" : "↓")}
              </th>
              <th style={{
    padding: "12px 16px",
    textAlign: "center",
    fontWeight: "600",
    borderBottom: "2px solid var(--lp-color-accent)",
    width: "110px",
    color: "var(--lp-color-on-accent)"
  }}>
                Pair
              </th>
              <th style={{
    padding: "12px 16px",
    textAlign: "center",
    fontWeight: "600",
    borderBottom: "2px solid var(--lp-color-accent)",
    width: "100px",
    color: "var(--lp-color-on-accent)"
  }}>
                Trust
              </th>
              <th style={{
    padding: "12px 16px",
    textAlign: "center",
    fontWeight: "600",
    borderBottom: "2px solid var(--lp-color-accent)",
    width: "100px",
    color: "var(--lp-color-on-accent)"
  }}>
                Link
              </th>
            </tr>
          </thead>
          <tbody>
            {sortedExchanges.map((exchange, index) => <tr key={index} style={{
    borderBottom: "1px solid var(--lp-color-border-default)"
  }}>
                <td style={{
    padding: "10px 16px",
    width: "220px",
    maxWidth: "220px",
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap"
  }}>
                  {exchange.name}
                </td>
                <td style={{
    padding: "10px 16px",
    textAlign: "center"
  }}>
                  <Badge color={exchange.type === "DEX" ? "purple" : "blue"}>
                    {exchange.type}
                  </Badge>
                </td>
                <td style={{
    padding: "10px 16px",
    textAlign: "center",
    fontFamily: "monospace",
    fontSize: "0.85rem",
    maxWidth: "110px",
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap"
  }}>
                  {exchange.tradingPair}
                </td>
                <td style={{
    padding: "10px 16px",
    textAlign: "center"
  }}>
                  <Icon icon="circle" iconType="solid" color={getTrustScoreColor(exchange.trustScore)} />
                </td>
                <td style={{
    padding: "10px 16px",
    textAlign: "center"
  }}>
                  <a href={exchange.url} target="_blank" rel="noopener noreferrer" rel="noopener noreferrer" style={{
    color: "var(--lp-color-accent)",
    textDecoration: "none"
  }}>
                    Trade →
                  </a>
                </td>
              </tr>)}
          </tbody>
        </table>
      </div>;
};

<Note>
  Livepeer does not recommend any specific exchange. This is provided as a
  convenient reference only.
</Note>

<Note>
  Machine-readable snapshot: [coingecko-arbitrum.json](/snippets/data/snapshots/coingecko-arbitrum.json) - static exchange index for AI agents and crawlers.
</Note>

## Exchanges that support Arbitrum One

This list (limited to 100 results) is dynamically fetched from [CoinGecko](https://www.coingecko.com/en/coins/arbitrum) using their [API](https://www.coingecko.com/en/api/documentation) and displayed in a sortable table, defaulting to the order provided by CoinGecko (which is typically sorted by trading volume/liquidity).

<CoinGeckoExchanges coinId="arbitrum" />
