Tools

Browser extension

A tiny Manifest V3 extension that uploads the image in your clipboard (or a file you pick) straight to your account. It uses the public API, so it needs an API key.

1. 1. Create an API key in your account settings.
2. 2. Save the three files below in a folder called hubie-extension.
3. 3. Open chrome://extensions and enable Developer mode.
4. 4. Choose “Load unpacked” and select the folder.
5. 5. Open the extension, paste your key once, and upload.

{
  "manifest_version": 3,
  "name": "UploadWithHubie",
  "version": "1.0.0",
  "description": "Upload images to UploadWithHubie",
  "action": { "default_popup": "popup.html" },
  "permissions": ["storage", "clipboardRead"]
}

<!doctype html>
<input id="key" type="password" placeholder="hubie_..." />
<input id="file" type="file" accept="image/*" />
<button id="go">Upload</button>
<pre id="out"></pre>
<script src="popup.js"></script>

const upload = async (file, key) => {
  const form = new FormData();
  form.append("files", file);
  const res = await fetch("https://uploadwithhubie.com/api/v1/upload", {
    method: "POST",
    headers: { Authorization: "Bearer " + key },
    body: form,
  });
  return res.json();
};

document.getElementById("go").onclick = async () => {
  const key = document.getElementById("key").value;
  const file = document.getElementById("file").files[0];
  if (!key || !file) return;
  const data = await upload(file, key);
  const url = data.images?.[0]?.directUrl || data.error;
  document.getElementById("out").textContent = url;
  if (data.images?.[0]) await navigator.clipboard.writeText(url);
};