# TagSpaces Pro Web — Self-Hosted File Management in Your Browser

> TagSpaces Pro Web is a self-hosted browser app offering advanced file management, tagging, Kanban boards, geo-tagging, and S3 storage support — all without cloud lock-in.

<SoftwareApplicationSD
  name="TagSpaces Pro Web"
  url="https://www.tagspaces.org/products/proweb/"
  description="TagSpaces Pro Web is a self-hosted browser app offering advanced file management, tagging, Kanban boards, geo-tagging, and S3 storage support — all without cloud lock-in."
  operatingSystem="Web"
  featureList={[
    "Self-hosted web application",
    "Kanban board perspective",
    "Geo-tagging with interactive maps",
    "S3-compatible object storage support",
    "Advanced tagging and file management",
    "Easy deployment on any static web server or NAS",
    "Custom configuration support",
  ]}
/>

export const proWebFeatures = {
  s3proxy: {
    title: "Self-Hosted Object Storage with S3Proxy",
    description: (
      <>
        S3Proxy exposes a local file system as an S3-compatible API over HTTPS. Point it at a folder on your NAS or
        server, and TagSpaces Pro Web connects to it as if it were AWS S3. Tag, preview, and edit files directly in the
        browser — no cloud provider required.
      </>
    ),
    items: [
      <>
        Any folder becomes S3 — expose local directories with access and secret keys
      </>,
      <>
        Fully self-hosted — your data stays on your hardware
      </>,
      <>
        Open source — S3Proxy is licensed under <Link to="https://github.com/gaul/s3proxy">Apache 2.0</Link>
      </>,
    ],
    actionButtonTitle: "Installation tutorial",
    actionButtonLink: "https://docs.tagspaces.org/tutorials/setup-tagspaces-web",
    imageAlt: "Diagram showing S3Proxy connecting TagSpaces to local storage",
    imageUrl: "/content/external/s3proxy-diagram.svg",
  },
  customConfig: {
    title: "Configure Once, Deploy Everywhere",
    description: (
      <>
        Roll out TagSpaces to your team with a shared configuration — predefined locations, tag libraries, themes, and
        map tile servers. All settings are defined in a single JSON file.
      </>
    ),
    items: [
      <>
        Custom locations — preconfigure S3 buckets for your team
      </>,
      <>
        Shared tag libraries — consistent tagging across the organization
      </>,
      <>
        UI theming — custom colors, logos, and default perspectives
      </>,
      <>
        Map tile servers — use your own OpenStreetMap or satellite imagery
      </>,
    ],
    actionButtonTitle: "Configuration docs",
    actionButtonLink: "https://docs.tagspaces.org/dev/external-config/",
    imageAlt: "TagSpaces with a custom color theme and logo",
    imageUrl: "/content/tagspaces-external-config.png",
    imageHref: "https://docs.tagspaces.org/dev/external-config/",
  },
};

{/* ──── Section 1: Hero ──── */}

  <Spacer height={50} />
  {"TagSpaces Pro — in your browser"}
  
    All the power of TagSpaces Pro, self-hosted on your NAS or server. Access your files from any device with a browser
    — no installation, no cloud, no vendor.
  
  
    {"Get TagSpaces Pro Web"}
  
  
    Self-hosted &middot; Works on any device with a browser &middot; Annual subscription
  

{/* ──── Section 2: Hero visual ──── */}

  <FullScreenImage src="/content/tagspaces-pro-web.avif" caption="TagSpaces Pro Web running in Chrome" showCaption />

<Spacer height={60} />

{/* ──── Section 3: Benefit cards ──── */}

  {"Why self-host?"}
  <Spacer height={20} />
  <CardGrid items={[
    { title: "Your server, your data", text: "Files stay on hardware you control — a NAS, a Raspberry Pi, a company server. No third-party ever touches your data." },
    { title: "Access from any device", text: "Open TagSpaces in Chrome, Firefox, Safari, or Edge — on desktop, tablet, or phone. No app to install, no sync to configure." },
    { title: "Deploy in minutes", text: "A static web server is all you need — Docker, Cloudflare Pages, or any NAS with a web server. No backend, no database." },
  ]} />

<Spacer height={60} />

{/* ──── Section 4: How it works ──── */}

  {"How it works"}
  
    TagSpaces Pro Web is a static web app that connects to S3-compatible object storage. Your files live on the storage,
    the app runs in the browser. Nothing in between.
  
  <Spacer height={20} />
  
    
      
        {"1. Host the app"}
        
          Deploy the static files on any web server — Docker, Cloudflare, Nginx, Apache, or your NAS built-in web
          server. One folder, no dependencies.
        
        <Link to="https://docs.tagspaces.org/tutorials/tagspaces-web-docker/" style={{ fontSize: "0.85rem" }}>
          {"Docker setup guide →"}
        </Link>
        
        <Link to="https://docs.tagspaces.org/tutorials/tagspaces-web-cloudflare/" style={{ fontSize: "0.85rem" }}>
          {"Cloudflare setup guide →"}
        </Link>
      
    
    
      
        {"2. Connect your storage"}
        
          Point TagSpaces at your S3-compatible storage — AWS S3, Wasabi, Cloudflare R2, or a self-hosted S3Proxy/Garage
          instance on your LAN.
        
        <Link to="https://docs.tagspaces.org/tutorials/s3-bucket-locations/" style={{ fontSize: "0.85rem" }}>
          {"AWS S3 setup →"}
        </Link>
        
        <Link to="https://docs.tagspaces.org/tutorials/wasabi-locations/" style={{ fontSize: "0.85rem" }}>
          {"Wasabi setup →"}
        </Link>
      
    
  
  <Spacer height={10} />
  <FullScreenImage
    src="/content/tagspaces-pro-web-architecture.svg"
    caption="Software architecture of TagSpaces Pro Web"
    showCaption
    removeShadow
  />

<Spacer height={60} />

{/* ──── Section 5: Feature blocks (S3Proxy + Config) ──── */}

  <RenderFeatures features={proWebFeatures} />

<Spacer height={60} />

{/* ──── Section 6: All Pro features included ──── */}

  {"All Pro features included"}
  
    TagSpaces Pro Web includes every feature from <Link to="/products/pro/">TagSpaces Pro</Link> — Kanban boards, map
    views, gallery perspective, calendar, AI integration, custom thumbnails, sharing, and more. The only difference is
    where it runs: in your browser instead of on your desktop.
  
  <Link to="/products/pro/" style={{ fontSize: "0.9rem" }}>
    {"See all Pro features →"}
  </Link>

<Spacer height={60} />

{/* ──── Section 7: Mobile + Demo ──── */}

  {"Works on mobile too"}
  
    The mobile mode adapts the interface for phones and tablets — same features, touch-friendly layout.
  
  <Spacer height={20} />
  
    
      
        <FullScreenImage
          src="/content/v6/mobile-pwa.avif"
          caption="Mobile PWA version of TagSpaces Pro Web"
          maxWidth="300px"
        />
      
      <Spacer height={10} />
      
        {"Try mobile demo"}
      
    
    
      <Demo url="https://demo.tagspaces.com/" title="Read-only demo of TagSpaces Pro Web" />
    
  

<Spacer height={60} />

{/* ──── Section 8: Pricing ──── */}

  {"Pricing"}
  <Spacer height={10} />
  <ProductSummary productType="proweb" condensed="true" />

<Spacer height={60} />

{/* ──── Section 9: Bottom CTA ──── */}

  {"Ready to self-host your file manager?"}
  <Spacer height={10} />
  
    {"Get TagSpaces Pro Web"}
  
  
    <Link to="https://docs.tagspaces.org/tutorials/tagspaces-web-docker/">{"Installation guide"}</Link>
    {" · "}
    <Link to="/products/#compare-features">{"Compare all features"}</Link>
    {" · "}
    <Link to="/products/pro/">{"TagSpaces Pro (desktop)"}</Link>
  
  
    {"Want to try the web version first? A free, open-source "}
    <Link to="/downloads/">{"TagSpaces Lite for Web"}</Link>
    {" is available for download."}
  

<Spacer height={80} />