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

# Supported Assets

> Browse all supported tokens and blockchains in Rampnow

<Note>
  **Real-time data** — This list is generated directly from the live Rampnow configuration API and updates automatically as new assets are added or removed.
</Note>

## How to Use This Page

Use the interactive explorer below to find supported tokens across all networks.

<Steps>
  <Step title="Search for assets">
    Type a token symbol (e.g. `USDT`, `ETH`, `SOIL`) or blockchain name (e.g. `ethereum`, `pulsechain`) in the search bar.
  </Step>

  <Step title="Filter by blockchain">
    Use the blockchain dropdown to view all tokens available on a specific network.
  </Step>

  <Step title="Filter by product">
    Select **Onramp**, **Offramp**, or **All products** to filter tokens by their supported operations.
  </Step>
</Steps>

<Card title="Skip to Token Explorer" icon="arrow-down" href="#supported-assets">
  Jump directly to the interactive token list to search and filter supported assets.
</Card>

### Understanding the Badges

<div style={{display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '1rem'}}>
  <Card title="Chain Badge" icon="link">
    Shows which blockchain the token is supported on (e.g. Ethereum, Polygon, Arbitrum).
  </Card>

  <Card title="Product Badges" icon="tag">
    Indicates whether the token supports **Onramp** (buy with fiat) and/or **Offramp** (sell for fiat).
  </Card>
</div>

## What's Included

<AccordionGroup>
  <Accordion title="Onramp-enabled tokens" icon="arrow-down">
    Assets that can be purchased with fiat via Rampnow using cards, bank transfers and local payment methods (availability varies by region).
  </Accordion>

  <Accordion title="Offramp-enabled tokens" icon="arrow-up">
    Assets that can be sold for fiat and paid out to supported payout methods in your region.
  </Accordion>

  <Accordion title="Multi-chain assets" icon="network-wired">
    If a token is available on multiple blockchains, you'll see a separate entry per chain. For example, `USDT` appears separately for Ethereum, Arbitrum, Polygon and other supported networks.
  </Accordion>
</AccordionGroup>

<Info>
  Only tokens with at least one active product configuration (Onramp or Offramp) are shown. Internal test assets, disabled assets, or temporarily paused routes are not listed.
</Info>

## Live Updates & Coverage

The asset list automatically reflects production changes:

* ✅ **New tokens and blockchains** appear automatically once activated
* ❌ **Paused or removed tokens** disappear from the list immediately
* 📊 **Token and blockchain counts** at the top always show current coverage

<Warning>
  Token availability may vary by region due to regulatory requirements and liquidity constraints.
</Warning>

## Missing a Token or Chain?

Need support for a specific asset that's not listed?

<div style={{display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '1rem'}}>
  <Card title="Contact Sales" icon="envelope" href="https://rampnow.io/en/list#list-token-form">
    Reach out via our Contact & Support page
  </Card>

  <Card title="Email Us" icon="paper-plane">
    Send details to `admin@rampnow.io`
  </Card>
</div>

**What to include in your request:**

* Token symbol and name
* Contract address
* Target blockchain
* Use case or integration timeline

<Tip>
  Our team reviews all requests based on demand and liquidity availability. We'll respond with integration timelines and next steps.
</Tip>

export const TokenExplorer = () => {
  const [tokens, setTokens] = useState([]);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);
  const [searchQuery, setSearchQuery] = useState("");
  const [selectedChain, setSelectedChain] = useState("all");
  const [selectedProduct, setSelectedProduct] = useState("all");
  useEffect(() => {
    async function load() {
      try {
        const res = await fetch("https://api.rampnow.io/api/ramp/v1/ramp_order/quote/config?apiKey=pk_live_zXuMmMzFAbfnMPQnwfEaMkabwPfKsVsg");
        if (!res.ok) throw new Error("Failed to load config");
        const json = await res.json();
        const assetConfigs = json?.data?.assetConfigs || ({});
        const normalized = Object.entries(assetConfigs).filter(([assetKey, assetConfig]) => typeof assetKey === "string" && assetKey.includes(":") && assetConfig?.orderTypeConfigs).map(([assetKey, assetConfig]) => {
          const [symbol, chain] = assetKey.split(":");
          const orderTypeConfig = assetConfig.orderTypeConfigs || ({});
          const products = [];
          if (orderTypeConfig?.["buy"]?.status?.toLowerCase() === "active") products.push("Onramp");
          if (orderTypeConfig?.["sell"]?.status?.toLowerCase() === "active") products.push("Offramp");
          return {
            symbol: symbol.trim(),
            name: symbol.trim(),
            chain: chain.trim(),
            products
          };
        }).filter(t => t.products.length > 0);
        setTokens(normalized);
        setLoading(false);
      } catch (e) {
        setError("Unable to load supported assets.");
        setLoading(false);
      }
    }
    load();
  }, []);
  const chains = useMemo(() => {
    const uniqueChains = [...new Set(tokens.map(t => t.chain))];
    return ["all", ...uniqueChains.sort()];
  }, [tokens]);
  const availableProducts = useMemo(() => {
    const set = new Set();
    tokens.forEach(t => t.products.forEach(p => set.add(p)));
    return ["all", ...Array.from(set)];
  }, [tokens]);
  const filteredTokens = useMemo(() => {
    const query = searchQuery.trim().toLowerCase();
    return tokens.filter(t => {
      const matchesSearch = !query || t.name.toLowerCase().includes(query) || t.chain.toLowerCase().includes(query);
      const matchesChain = selectedChain === "all" || t.chain === selectedChain;
      const matchesProduct = selectedProduct === "all" || t.products.includes(selectedProduct);
      return matchesSearch && matchesChain && matchesProduct;
    });
  }, [tokens, searchQuery, selectedChain, selectedProduct]);
  if (loading) return <div className="flex items-center justify-center p-10"><div className="text-sm text-zinc-950/70 dark:text-white/70">Loading...</div></div>;
  if (error) return <div className="p-4 text-sm text-red-700 bg-red-50 dark:bg-red-900/20 rounded-xl border border-red-200 dark:border-red-800">{error}</div>;
  return <div className="space-y-6 not-prose">
      <div className="text-sm text-zinc-950/70 dark:text-white/70">
        <div className="font-semibold text-zinc-950 dark:text-white mb-1">{tokens.length} tokens · {chains.length - 1} blockchains</div>
        <p>Search or filter supported assets across all networks.</p>
      </div>

      <div className="grid gap-4 md:grid-cols-2">
        <input type="text" placeholder="Search by token or blockchain..." value={searchQuery} onChange={e => setSearchQuery(e.target.value)} className="w-full px-4 py-2.5 rounded-xl border border-zinc-950/10 dark:border-white/10 bg-white dark:bg-zinc-900 text-sm text-zinc-950 dark:text-white placeholder:text-zinc-950/50 dark:placeholder:text-white/50 focus:outline-none focus:ring-2 focus:ring-zinc-950/20 dark:focus:ring-white/20" />
        <select value={selectedChain} onChange={e => setSelectedChain(e.target.value)} className="w-full px-4 py-2.5 rounded-xl border border-zinc-950/10 dark:border-white/10 bg-white dark:bg-zinc-900 text-sm text-zinc-950 dark:text-white focus:outline-none focus:ring-2 focus:ring-zinc-950/20 dark:focus:ring-white/20">
          {chains.map(chain => <option key={chain} value={chain}>{chain === "all" ? "All blockchains" : chain}</option>)}
        </select>
      </div>

      <div className="space-y-2">
        <div className="text-xs font-medium text-zinc-950/70 dark:text-white/70">Filter by product</div>
        <div className="flex flex-wrap gap-2">
          {availableProducts.map(product => <button key={product} onClick={() => setSelectedProduct(product)} className={selectedProduct === product ? "px-4 py-2 rounded-lg text-xs font-semibold border-2 border-green-500 dark:border-zinc-500 text-zinc-600 dark:text-zinc-500 bg-zinc-100 dark:bg-zinc-800 shadow-sm transition-all duration-200 ease-in-out" : "px-4 py-2 rounded-lg text-xs font-medium border-2 border-zinc-900 dark:border-white text-zinc-900 dark:text-white bg-white dark:bg-zinc-900 hover:border-green-500 dark:hover:border-zinc-500 hover:bg-zinc-50 dark:hover:bg-zinc-800 transition-all duration-200 ease-in-out"}>
  {product === "all" ? "All products" : product}
</button>)}
        </div>
      </div>

      <div className="flex justify-between text-xs text-zinc-950/70 dark:text-white/70">
        <span>Showing {filteredTokens.length} of {tokens.length}</span>
        {(searchQuery || selectedChain !== "all" || selectedProduct !== "all") && <button onClick={() => {
    setSearchQuery("");
    setSelectedChain("all");
    setSelectedProduct("all");
  }} className="font-medium text-zinc-950 dark:text-white hover:underline">Reset</button>}
      </div>

      <div className="overflow-x-auto">
        <table className="w-full text-sm">
          <thead>
            <tr className="border-b border-zinc-950/10 dark:border-white/10">
              <th className="text-left py-3 px-4 font-semibold text-zinc-950 dark:text-white">Token</th>
              <th className="text-left py-3 px-4 font-semibold text-zinc-950 dark:text-white">Symbol</th>
              <th className="text-left py-3 px-4 font-semibold text-zinc-950 dark:text-white">Blockchain</th>
              <th className="text-left py-3 px-4 font-semibold text-zinc-950 dark:text-white">Products</th>
            </tr>
          </thead>
          <tbody>
            {filteredTokens.map((t, idx) => <tr key={idx} className="border-b border-zinc-950/5 dark:border-white/5 hover:bg-zinc-950/5 dark:hover:bg-white/5 transition-colors">
                <td className="py-3 px-4 text-zinc-950 dark:text-white">{t.name}</td>
                <td className="py-3 px-4 text-zinc-950/70 dark:text-white/70">{t.symbol}</td>
                <td className="py-3 px-4">
                  <span className="inline-block px-2 py-0.5 rounded-md text-xs border border-zinc-950/10 dark:border-white/10 text-zinc-950/80 dark:text-white/80">
                    {t.chain}
                  </span>
                </td>
                <td className="py-3 px-4">
                  <div className="flex flex-wrap gap-1">
                    {t.products.map(p => <span key={p} className="inline-block px-2 py-0.5 rounded-md text-xs border border-zinc-950/10 dark:border-white/10 text-zinc-950/80 dark:text-white/80">
                        {p}
                      </span>)}
                  </div>
                </td>
              </tr>)}
          </tbody>
        </table>
      </div>
    </div>;
};

# Supported Assets

<TokenExplorer />