RandomFox

How to Use This API

1. Random Fox — JSON Response

https://randomfox.ca/floof/

Returns JSON: {"image":"https://randomfox.ca/images/42.jpg","link":"https://randomfox.ca/42/"}

2. Direct Image

https://randomfox.ca/images/42.jpg

Use the image URL directly from the JSON response to embed in <img> tags.

3. Specific Fox by ID

https://randomfox.ca/?i=7

Fetch a specific fox image by its ID number. The API has a collection of fox photos indexed by number.

4. JavaScript — Fox Display

async function showRandomFox() {
  const resp = await fetch('https://randomfox.ca/floof/');
  const data = await resp.json();
  
  const img = document.getElementById('fox-image');
  if (img) {
    img.src = data.image;
    img.alt = 'Random fox';
    img.style = 'max-width:500px;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,0.2);';
  }
}

// Call on page load or button click
document.addEventListener('DOMContentLoaded', showRandomFox);
// Or: <button onclick="showRandomFox()">New Fox!</button>

5. Python — Multiple Foxes

import requests

def get_multiple_foxes(count=3):
    foxes = []
    for _ in range(count):
        resp = requests.get('https://randomfox.ca/floof/')
        foxes.append(resp.json()['image'])
    return foxes

def save_foxes():
    urls = get_multiple_foxes(3)
    for i, url in enumerate(urls):
        img = requests.get(url)
        filename = f'fox_{i+1}.jpg'
        with open(filename, 'wb') as f:
            f.write(img.content)
        print(f'Saved {filename}')
    
save_foxes()