supabasetutorialweb-development

Free Image Hosting with Supabase Storage

How to set up Supabase Storage as a free CDN for your blog images — with public buckets, RLS policies, and optimized delivery.

· 2 min read

The Problem

Every blog needs images, but hosting them can get expensive quickly. Most image CDNs charge per bandwidth, and storing images in your Git repo bloats the repository.

Enter Supabase Storage

Supabase offers a generous free tier that includes 1GB of storage and 2GB of bandwidth per month. For a personal blog, that's more than enough.

Setting Up a Public Bucket

  1. Create a new project on Supabase
  2. Navigate to Storage → Create new bucket
  3. Name it blog-images and set it to Public
  4. Configure RLS policy for public read access
CREATE POLICY "Public read access"
ON storage.objects FOR SELECT
USING (bucket_id = 'blog-images');

Upload Workflow

The workflow is simple:

  1. Compress your image to WebP format
  2. Upload via the Supabase dashboard
  3. Copy the public URL
  4. Paste it into your Markdown or Keystatic field

The URL pattern is predictable:

https://<project-ref>.supabase.co/storage/v1/object/public/blog-images/<filename>

Performance Tips

  • Always convert images to WebP before uploading
  • Use descriptive filenames for SEO
  • Add loading="lazy" to images below the fold
  • Set explicit width and height attributes to prevent CLS

This setup gives you a completely free, CDN-backed image hosting solution for your blog!

Share this article