Skip to main content
The AFFiNE web app provides full access to all features directly in your browser, with no installation required. Access your workspace from anywhere at app.affine.pro.

​
Browser Support

AFFiNE works best in modern browsers:

Chrome

Version 90+

Firefox

Version 88+

Safari

Version 14+

Edge

Version 90+

Brave

Latest version

Arc

Latest version
For the best experience, we recommend Chrome or Edge (Chromium-based browsers).

​
Quick Start

1

Visit app.affine.pro

Open app.affine.pro in your browser
2

Sign in or continue as guest

Create an account for cloud sync, or use locally without an account
3

Create your first workspace

Choose local-only or cloud-synced workspace
4

Start creating

Begin writing, drawing, and organizing

​
Features

​
Full Feature Parity

The web app includes all AFFiNE features:
  • Block-based editor: Rich text, code, embeds, and more
  • Edgeless whiteboard: Infinite canvas for visual thinking
  • Databases: Table, kanban, and gallery views
  • Real-time collaboration: Work with others simultaneously
  • AI assistant: Writing help and content generation
  • Local-first storage: Data stored in your browser

​
Progressive Web App (PWA)

Install AFFiNE as a PWA for an app-like experience:
  1. Visit app.affine.pro
  2. Click the install icon in the address bar
  3. Click “Install” in the popup
PWA Benefits:
  • Standalone window (no browser UI)
  • Desktop/home screen icon
  • Offline access
  • Faster loading
  • Native feel

​
Offline Support

The web app works offline using service workers:
  • All data cached in IndexedDB
  • Full editing capability offline
  • Automatic sync when reconnected
  • Background sync for updates

​
Storage

​
Browser Storage

The web app stores data in your browser: 
// Storage breakdown
IndexedDB/
  ├── workspaces/          # Workspace metadata
  ├── docs/                # Document CRDT data
  └── blobs/               # Images and attachments

LocalStorage/
  ├── user-settings        # User preferences
  └── ui-state             # UI state (sidebar, etc.)

CacheStorage/
  └── app-assets           # App code and assets

​
Storage Limits

Browser storage quotas vary:
BrowserTypical LimitNotes
Chrome~60% of diskUp to 80% available disk
Firefox~50% of diskUser can increase
Safari~1GBCan request more
Edge~60% of diskSame as Chrome
Browser storage can be cleared by:
  • Clearing browser data
  • Private/incognito mode ending
  • Storage pressure (automatic eviction)
Always enable cloud sync or regular backups for important data.

​
Managing Storage

View and manage storage:
  1. Settings → Storage
  2. See usage by workspace
  3. Clear cache
  4. Export workspaces

​
Performance

​
Optimization

The web app is optimized for performance:
  • Code splitting: Load only what’s needed
  • Lazy loading: Images and components load on demand
  • Virtual scrolling: Handle large documents
  • Service workers: Fast caching and offline access
  • Web Workers: Offload heavy computation
  • WebAssembly: Fast CRDT operations (when available)

​
Large Workspaces

For workspaces with many documents or large files:
  • Enable cloud sync to offload data
  • Close unused documents
  • Use collections to organize
  • Clear cache regularly
  • Consider desktop app for better performance

​
Browser Features

​
Keyboard Shortcuts

Full keyboard shortcut support in browsers:
ShortcutAction
Ctrl/⌘ + KQuick search
Ctrl/⌘ + NNew page
Ctrl/⌘ + S(Auto-saved)
Ctrl/⌘ + ZUndo
Ctrl/⌘ + Shift + ZRedo
Ctrl/⌘ + BBold
Ctrl/⌘ + IItalic
/Slash commands

​
Copy/Paste

Rich content copy/paste:
  • Text formatting: Preserves bold, italic, links
  • Images: Paste from clipboard
  • Tables: Copy from spreadsheets
  • Code: Syntax highlighting preserved
  • Blocks: Copy entire blocks between pages

​
Drag & Drop

  • Drag images from desktop
  • Drop files to upload
  • Reorder blocks by dragging
  • Drag between browser windows

​
Self-Hosting

You can host the web app on your own infrastructure: 
docker run -d \
  --name affine \
  -p 3010:3010 \
  -v affine-data:/app/data \
  ghcr.io/toeverything/affine-selfhosted:stable
See our self-hosting guide for details.

​
Security

​
HTTPS Only

AFFiNE requires HTTPS for:
  • Service worker registration
  • Clipboard access
  • Camera/microphone access
  • Secure cookie handling

​
Content Security Policy

Strict CSP prevents XSS attacks: 
Content-Security-Policy:
  default-src 'self';
  script-src 'self' 'unsafe-inline';
  style-src 'self' 'unsafe-inline';
  img-src 'self' data: https:;
  connect-src 'self' wss: https:;

​
Authentication

  • Secure cookie-based sessions
  • CSRF token protection
  • HTTPOnly cookies
  • SameSite=Strict
  • Regular session rotation

​
Troubleshooting

​
App Won’t Load

  1. Open browser settings
  2. Privacy → Clear browsing data
  3. Select cached images and files
  4. Clear data and reload
Some extensions interfere with AFFiNE:
  • Ad blockers (whitelist app.affine.pro)
  • Privacy tools (allow cookies and storage)
  • Script blockers (allow JavaScript)
Ensure your browser is up to date:
  • Chrome/Edge: Version 90+
  • Firefox: Version 88+
  • Safari: Version 14+

​
Sync Issues

1

Check network

Ensure you have a stable internet connection
2

Verify account

Make sure you’re signed in with a cloud account
3

Check sync status

Look for sync indicator in the sidebar
4

Force refresh

Ctrl/⌘ + Shift + R to force reload

​
Performance Issues

  • Close unused tabs
  • Disable unnecessary extensions
  • Clear browser cache
  • Restart browser
  • Close unused workspaces
  • Reduce image sizes
  • Clear AFFiNE cache in settings
  • Use desktop app for large workspaces

​
Development

Build the web app locally:
1

Install dependencies

yarn install
2

Start dev server

yarn workspace @affine/web dev
3

Open browser

Visit http://localhost:8080

Desktop App

Native app with better performance

Mobile Apps

iOS and Android applications

Self-Hosting

Host your own AFFiNE instance

Browser Extensions

Extend browser functionality