diff --git a/README.md b/README.md
index 6950dc4..28a1596 100644
--- a/README.md
+++ b/README.md
@@ -23,6 +23,12 @@ Synapse is a Vite + React + TypeScript application that turns complex content in
 - **Rewriter API**: Text simplification with reading level control, tone adjustment (formal/casual), length modification, and streaming support
 - **Translator API**: Multi-language translation (20+ languages) with automatic language detection and format preservation
 - **Prompt API**: Conversational AI with temperature control, system prompts, and streaming responses
+- **Writing Enhancement**: Comprehensive writing assistance combining multiple APIs:
+  - Grammar and spelling correction (Proofreader API)
+  - Tone adjustment (Writer + Rewriter APIs)
+  - Key point extraction for summaries (Prompt API)
+  - Text expansion and elaboration (Writer API)
+  - Actionable writing improvement suggestions (Prompt API)
 - **Service Layer**: Production-ready wrappers with error handling, retry logic, content validation, and sanitization
 
 ### UI Components
@@ -44,11 +50,12 @@ Synapse is a Vite + React + TypeScript application that turns complex content in
 - **Status Indicators**: Visual feedback for API availability, processing state, and elapsed time tracking
 
 ### Developer Experience
-- **Comprehensive Error Handling**: Type-safe error guards for Rewriter, Translator, and Prompt APIs
-- **React Hooks**: `useRewriter`, `useTranslator`, `usePrompt`, `useTextInput`, `useFileUpload`, and `useContentExtraction` for state management
+- **Comprehensive Error Handling**: Type-safe error guards for Rewriter, Translator, Prompt, Writer, and Proofreader APIs
+- **React Hooks**: `useRewriter`, `useTranslator`, `usePrompt`, `useWritingEnhancement`, `useTextInput`, `useFileUpload`, and `useContentExtraction` for state management
 - **Browser Compatibility**: Automatic detection and user-friendly warnings for unsupported browsers
 - **Capability Detection**: Runtime checks for API availability with graceful degradation
 - **File Processing**: Secure local PDF.js worker, content validation, and robust extraction pipeline
+- **Test Infrastructure**: Dedicated test pages for all Chrome AI APIs with real-time diagnostics and event logging
 
 ## Tooling & Architecture
 
@@ -93,6 +100,7 @@ Access interactive demos at `/demos`:
 - **Rewriter API Demo** (`/demos/rewriter`): Test text simplification with various options
 - **Translator API Demo** (`/demos/translator`): Translate between 20+ languages with streaming
 - **Prompt API Demo** (`/demos/prompt`): Conversational AI with advanced configuration
+- **Writing Enhancement Demo** (`/demos/writing-enhancement`): Test comprehensive writing assistance features
 
 Each demo includes:
 - Real-time API status indicators
@@ -100,6 +108,7 @@ Each demo includes:
 - Error handling demonstrations
 - Browser compatibility checks
 - Comprehensive diagnostics
+- Event logging for debugging
 
 ## Scripts
 
@@ -213,12 +222,15 @@ clear()
 
 - **Chrome Canary 137+** (or Dev channel)
 - **Chrome AI flags enabled**: Navigate to `chrome://flags` and enable:
-  - `#optimization-guide-on-device-model`
-  - `#prompt-api-for-gemini-nano`
-  - `#translation-api`
-  - `#rewriter-api`
+  - `#optimization-guide-on-device-model` (required for model download)
+  - `#prompt-api-for-gemini-nano` (for Prompt API and writing suggestions)
+  - `#translation-api` (for Translator API)
+  - `#rewriter-api` (for Rewriter API and tone simplification)
+  - `#writer-api` (for Writer and Proofreader APIs - grammar correction, text expansion)
 - **AI model downloaded**: ~2GB download occurs automatically on first use
 
+For detailed setup instructions with screenshots, see the **[Writing Enhancement Setup Guide](./docs/SETUP.md)**.
+
 ## File Upload Configuration
 
 ### Security Features
@@ -261,10 +273,45 @@ The URL extraction feature uses Mozilla Readability to extract clean article con
 - **Supported Sites**: Works best with article-based content (blogs, news sites, documentation)
 - **Content Sanitization**: All extracted HTML is sanitized with DOMPurify to prevent XSS attacks
 
+### Writing Enhancement Service
+```typescript
+import { WritingEnhancementService } from '@/lib/chrome-ai/services'
+
+const service = new WritingEnhancementService()
+await service.initialize()
+
+// Grammar and spelling correction
+const corrected = await service.correctGrammar('Text with erors and mistakes')
+console.log(corrected.stats) // { totalCorrections: 2, grammarErrors: 1, spellingErrors: 1, ... }
+
+// Adjust tone
+const professional = await service.adjustTone('hey whats up!', 'professional')
+const simple = await service.adjustTone('The algorithm utilizes...', 'simple')
+
+// Extract key points
+const keyPoints = await service.extractKeyPoints('Long article text...')
+console.log(keyPoints) // [{ point: "Main idea", importance: "primary" }, ...]
+
+// Get writing suggestions
+const suggestions = await service.getWritingSuggestions('Text to improve')
+console.log(suggestions) // [{ category: "clarity", issue: "...", suggestion: "...", priority: "high" }, ...]
+
+// Expand brief text
+const expanded = await service.expandText('Brief intro', 'medium')
+
+// Run multiple enhancements at once
+const enhanced = await service.enhanceText('Text to enhance', {
+  correctGrammar: true,
+  extractKeyPoints: true,
+  getSuggestions: true,
+  adjustTone: 'professional'
+})
+```
+
 ## Next Steps
 
 - Expand Workspace page with multi-API processing pipelines
 - Add Summarizer and Language Detector API integrations
-- Implement Writer & Proofreader API demos
 - Add automated tests (Vitest + React Testing Library)
 - Integrate state management (Zustand) for cross-component state
+- Add quality scoring and telemetry for Writing Enhancement
diff --git a/src/components/test/WritingEnhancementTest.tsx b/src/components/test/WritingEnhancementTest.tsx
new file mode 100644
index 0000000..3b131ce
--- /dev/null
+++ b/src/components/test/WritingEnhancementTest.tsx
@@ -0,0 +1,594 @@
+import { useState, useRef, useEffect, useCallback } from 'react'
+import { WritingEnhancementService, type AIModelDownloadProgress } from '@/lib/chrome-ai'
+import type {
+  WritingSuggestion,
+  KeyPoint,
+  WritingEnhancementResult,
+} from '@/lib/chrome-ai/services/WritingEnhancementService'
+import type { EnhancedProofreadResult } from '@/lib/chrome-ai/services/ProofreaderService'
+import { ChromeAiDiagnostics } from './ChromeAiDiagnostics'
+import {
+  InlineSpinner,
+  ModelDownloadProgress,
+  DownloadStatus,
+} from '@/components/ui'
+
+/**
+ * Test component for Chrome Writing Enhancement APIs
+ * This component allows manual testing of all WritingEnhancementService features
+ */
+export const WritingEnhancementTest = () => {
+  const [serviceStatus, setServiceStatus] = useState<'idle' | 'initializing' | 'ready' | 'error'>('idle')
+  const [isProcessing, setIsProcessing] = useState(false)
+  const [inputText, setInputText] = useState(DEFAULT_TEST_TEXT)
+  const [selectedTone, setSelectedTone] = useState<'professional' | 'casual' | 'academic' | 'simple'>('professional')
+  const [error, setError] = useState<string | null>(null)
+  const [logs, setLogs] = useState<string[]>([])
+  const [downloadProgress, setDownloadProgress] = useState<AIModelDownloadProgress | null>(null)
+  const [downloadStatus, setDownloadStatus] = useState<string>(DownloadStatus.CHECKING)
+
+  // Results for individual operations
+  const [grammarResult, setGrammarResult] = useState<EnhancedProofreadResult | null>(null)
+  const [toneResult, setToneResult] = useState<string | null>(null)
+  const [keyPointsResult, setKeyPointsResult] = useState<KeyPoint[] | null>(null)
+  const [expandedResult, setExpandedResult] = useState<string | null>(null)
+  const [suggestionsResult, setSuggestionsResult] = useState<WritingSuggestion[] | null>(null)
+  const [combinedResult, setCombinedResult] = useState<WritingEnhancementResult | null>(null)
+
+  const serviceRef = useRef<WritingEnhancementService | null>(null)
+
+  const addLog = (message: string) => {
+    const timestamp = new Date().toLocaleTimeString()
+    setLogs((prev) => [`[${timestamp}] ${message}`, ...prev].slice(0, 30))
+  }
+
+  const clearResults = () => {
+    setGrammarResult(null)
+    setToneResult(null)
+    setKeyPointsResult(null)
+    setExpandedResult(null)
+    setSuggestionsResult(null)
+    setCombinedResult(null)
+  }
+
+  const handleInitialize = async () => {
+    try {
+      setServiceStatus('initializing')
+      setError(null)
+      setDownloadProgress(null)
+      setDownloadStatus(DownloadStatus.CHECKING)
+      clearResults()
+      addLog('Initializing WritingEnhancementService...')
+
+      const service = new WritingEnhancementService()
+
+      await service.initialize()
+      serviceRef.current = service
+
+      setDownloadStatus(DownloadStatus.READY)
+      setDownloadProgress(null)
+      setServiceStatus('ready')
+      addLog('✓ WritingEnhancementService initialized successfully')
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setServiceStatus('error')
+      setDownloadStatus(DownloadStatus.FAILED)
+      setDownloadProgress(null)
+      setError(errorMsg)
+      addLog(`✗ Initialization failed: ${errorMsg}`)
+    }
+  }
+
+  const handleCorrectGrammar = async () => {
+    if (!serviceRef.current) {
+      setError('Service not initialized')
+      return
+    }
+
+    try {
+      setIsProcessing(true)
+      setError(null)
+      setGrammarResult(null)
+      addLog('Starting grammar correction...')
+
+      const result = await serviceRef.current.correctGrammar(inputText)
+
+      setGrammarResult(result)
+      addLog(`✓ Grammar correction complete (${result.stats.totalCorrections} corrections found)`)
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setError(errorMsg)
+      addLog(`✗ Grammar correction failed: ${errorMsg}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  const handleAdjustTone = async () => {
+    if (!serviceRef.current) {
+      setError('Service not initialized')
+      return
+    }
+
+    try {
+      setIsProcessing(true)
+      setError(null)
+      setToneResult(null)
+      addLog(`Starting tone adjustment to ${selectedTone}...`)
+
+      const result = await serviceRef.current.adjustTone(inputText, selectedTone)
+
+      setToneResult(result)
+      addLog(`✓ Tone adjustment complete (${result.length} characters)`)
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setError(errorMsg)
+      addLog(`✗ Tone adjustment failed: ${errorMsg}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  const handleExtractKeyPoints = async () => {
+    if (!serviceRef.current) {
+      setError('Service not initialized')
+      return
+    }
+
+    try {
+      setIsProcessing(true)
+      setError(null)
+      setKeyPointsResult(null)
+      addLog('Extracting key points...')
+
+      const result = await serviceRef.current.extractKeyPoints(inputText)
+
+      setKeyPointsResult(result)
+      addLog(`✓ Key point extraction complete (${result.length} points found)`)
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setError(errorMsg)
+      addLog(`✗ Key point extraction failed: ${errorMsg}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  const handleExpandText = async () => {
+    if (!serviceRef.current) {
+      setError('Service not initialized')
+      return
+    }
+
+    try {
+      setIsProcessing(true)
+      setError(null)
+      setExpandedResult(null)
+      addLog('Expanding text...')
+
+      const result = await serviceRef.current.expandText(inputText, 'medium')
+
+      setExpandedResult(result)
+      addLog(`✓ Text expansion complete (${inputText.length} → ${result.length} characters)`)
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setError(errorMsg)
+      addLog(`✗ Text expansion failed: ${errorMsg}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  const handleGetSuggestions = async () => {
+    if (!serviceRef.current) {
+      setError('Service not initialized')
+      return
+    }
+
+    try {
+      setIsProcessing(true)
+      setError(null)
+      setSuggestionsResult(null)
+      addLog('Getting writing suggestions...')
+
+      const result = await serviceRef.current.getWritingSuggestions(inputText)
+
+      setSuggestionsResult(result)
+      addLog(`✓ Writing suggestions complete (${result.length} suggestions found)`)
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setError(errorMsg)
+      addLog(`✗ Writing suggestions failed: ${errorMsg}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  const handleEnhanceAll = async () => {
+    if (!serviceRef.current) {
+      setError('Service not initialized')
+      return
+    }
+
+    try {
+      setIsProcessing(true)
+      setError(null)
+      setCombinedResult(null)
+      addLog('Running all enhancements...')
+
+      const result = await serviceRef.current.enhanceText(inputText, {
+        correctGrammar: true,
+        extractKeyPoints: true,
+        getSuggestions: true,
+        adjustTone: selectedTone,
+        expand: false, // Skip expansion in combined test
+      })
+
+      setCombinedResult(result)
+      addLog(`✓ All enhancements complete`)
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : 'Unknown error'
+      setError(errorMsg)
+      addLog(`✗ Combined enhancement failed: ${errorMsg}`)
+    } finally {
+      setIsProcessing(false)
+    }
+  }
+
+  const handleDestroy = useCallback(() => {
+    if (serviceRef.current) {
+      serviceRef.current.destroy()
+      serviceRef.current = null
+      setServiceStatus('idle')
+      clearResults()
+      addLog('Service destroyed')
+    }
+  }, [])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      handleDestroy()
+    }
+  }, [handleDestroy])
+
+  return (
+    <div className="mx-auto max-w-7xl space-y-6 p-6">
+      {/* Header */}
+      <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+        <h1 className="text-2xl font-bold text-neutral-900">Writing Enhancement Test Suite</h1>
+        <p className="mt-2 text-sm text-neutral-600">
+          Test the Chrome Writing Enhancement APIs (Writer, Proofreader, Prompt, Rewriter)
+        </p>
+      </div>
+
+      {/* Diagnostics */}
+      <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+        <ChromeAiDiagnostics />
+      </div>
+
+      {/* Service Status */}
+      <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+        <div className="flex items-center justify-between">
+          <div>
+            <h2 className="text-lg font-semibold text-neutral-900">Service Status</h2>
+            <p className="mt-1 text-sm text-neutral-600">
+              Status:{' '}
+              <span
+                className={`font-semibold ${
+                  serviceStatus === 'ready'
+                    ? 'text-green-600'
+                    : serviceStatus === 'error'
+                      ? 'text-red-600'
+                      : 'text-neutral-600'
+                }`}
+              >
+                {serviceStatus}
+              </span>
+            </p>
+          </div>
+          <div className="flex gap-2">
+            <button
+              onClick={handleInitialize}
+              disabled={serviceStatus === 'ready' || serviceStatus === 'initializing'}
+              className="flex items-center gap-2 rounded-lg bg-primary-600 px-4 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {serviceStatus === 'initializing' && <InlineSpinner size="sm" variant="white" />}
+              {serviceStatus === 'initializing' ? 'Initializing...' : 'Initialize Service'}
+            </button>
+            <button
+              onClick={handleDestroy}
+              disabled={serviceStatus !== 'ready'}
+              className="rounded-lg border border-neutral-300 px-4 py-2 text-sm font-semibold text-neutral-700 hover:border-neutral-400 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              Destroy
+            </button>
+          </div>
+        </div>
+
+        {/* Download Progress */}
+        {serviceStatus === 'initializing' && downloadProgress && (
+          <div className="mt-4">
+            <ModelDownloadProgress
+              loaded={downloadProgress.loaded}
+              total={downloadProgress.total}
+              status={downloadStatus}
+              variant="primary"
+              animated={true}
+            />
+          </div>
+        )}
+
+        {/* Initialization Status (no download) */}
+        {serviceStatus === 'initializing' && !downloadProgress && (
+          <div className="mt-4 flex items-center gap-2 text-sm text-neutral-700">
+            <InlineSpinner size="sm" variant="primary" />
+            <span>{downloadStatus}</span>
+          </div>
+        )}
+
+        {error && (
+          <div className="mt-4 rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-800">
+            <strong>Error:</strong> {error}
+          </div>
+        )}
+      </div>
+
+      {/* Input Section */}
+      <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+        <h2 className="text-lg font-semibold text-neutral-900">Input Text</h2>
+        <textarea
+          value={inputText}
+          onChange={(e) => setInputText(e.target.value)}
+          className="mt-3 w-full rounded-lg border border-neutral-300 p-3 text-sm font-mono"
+          rows={8}
+          placeholder="Enter text to enhance..."
+        />
+        <div className="mt-2 flex items-center justify-between text-xs text-neutral-500">
+          <span>{inputText.length} characters</span>
+          <div className="flex gap-3">
+            <button
+              onClick={() => setInputText(DEFAULT_TEST_TEXT)}
+              className="text-primary-600 hover:underline"
+            >
+              Use default text
+            </button>
+            <button
+              onClick={() => setInputText(QUICK_TEST_PROMPTS[0])}
+              className="text-primary-600 hover:underline"
+            >
+              Short example
+            </button>
+          </div>
+        </div>
+      </div>
+
+      {/* Controls */}
+      <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+        <h2 className="text-lg font-semibold text-neutral-900">Test Operations</h2>
+
+        <div className="mt-4 grid gap-3">
+          {/* Grammar Correction */}
+          <div className="flex items-center gap-4">
+            <button
+              onClick={handleCorrectGrammar}
+              disabled={serviceStatus !== 'ready' || isProcessing}
+              className="flex items-center gap-2 rounded-lg bg-primary-600 px-6 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {isProcessing && <InlineSpinner size="sm" variant="white" />}
+              Test Grammar Correction
+            </button>
+            <span className="text-xs text-neutral-500">Requires Proofreader API</span>
+          </div>
+
+          {/* Tone Adjustment */}
+          <div className="flex items-center gap-4">
+            <select
+              value={selectedTone}
+              onChange={(e) => setSelectedTone(e.target.value as typeof selectedTone)}
+              className="rounded-lg border border-neutral-300 px-3 py-2 text-sm"
+            >
+              <option value="professional">Professional</option>
+              <option value="casual">Casual</option>
+              <option value="academic">Academic</option>
+              <option value="simple">Simple</option>
+            </select>
+            <button
+              onClick={handleAdjustTone}
+              disabled={serviceStatus !== 'ready' || isProcessing}
+              className="flex items-center gap-2 rounded-lg bg-primary-600 px-6 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {isProcessing && <InlineSpinner size="sm" variant="white" />}
+              Test Tone Adjustment
+            </button>
+            <span className="text-xs text-neutral-500">Requires Writer/Rewriter API</span>
+          </div>
+
+          {/* Key Points */}
+          <div className="flex items-center gap-4">
+            <button
+              onClick={handleExtractKeyPoints}
+              disabled={serviceStatus !== 'ready' || isProcessing}
+              className="flex items-center gap-2 rounded-lg bg-primary-600 px-6 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {isProcessing && <InlineSpinner size="sm" variant="white" />}
+              Test Key Point Extraction
+            </button>
+            <span className="text-xs text-neutral-500">Requires Prompt API</span>
+          </div>
+
+          {/* Text Expansion */}
+          <div className="flex items-center gap-4">
+            <button
+              onClick={handleExpandText}
+              disabled={serviceStatus !== 'ready' || isProcessing}
+              className="flex items-center gap-2 rounded-lg bg-primary-600 px-6 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {isProcessing && <InlineSpinner size="sm" variant="white" />}
+              Test Text Expansion
+            </button>
+            <span className="text-xs text-neutral-500">Requires Writer API</span>
+          </div>
+
+          {/* Writing Suggestions */}
+          <div className="flex items-center gap-4">
+            <button
+              onClick={handleGetSuggestions}
+              disabled={serviceStatus !== 'ready' || isProcessing}
+              className="flex items-center gap-2 rounded-lg bg-primary-600 px-6 py-2 text-sm font-semibold text-white hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {isProcessing && <InlineSpinner size="sm" variant="white" />}
+              Test Writing Suggestions
+            </button>
+            <span className="text-xs text-neutral-500">Requires Prompt API</span>
+          </div>
+
+          {/* Combined Enhancement */}
+          <div className="mt-4 border-t border-neutral-200 pt-4">
+            <button
+              onClick={handleEnhanceAll}
+              disabled={serviceStatus !== 'ready' || isProcessing}
+              className="flex items-center gap-2 rounded-lg bg-green-600 px-6 py-2 text-sm font-semibold text-white hover:bg-green-700 disabled:cursor-not-allowed disabled:opacity-50"
+            >
+              {isProcessing && <InlineSpinner size="sm" variant="white" />}
+              Test All Enhancements (Combined)
+            </button>
+          </div>
+        </div>
+      </div>
+
+      {/* Results Section */}
+      {(grammarResult || toneResult || keyPointsResult || expandedResult || suggestionsResult || combinedResult) && (
+        <div className="space-y-4">
+          {/* Grammar Results */}
+          {grammarResult && (
+            <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+              <h2 className="text-lg font-semibold text-neutral-900">Grammar Correction Results</h2>
+              <div className="mt-3 rounded-lg border border-neutral-200 bg-neutral-50 p-4 text-sm">
+                <pre className="whitespace-pre-wrap font-mono">{grammarResult.corrected}</pre>
+              </div>
+              <div className="mt-3 flex gap-4 text-xs text-neutral-600">
+                <span>Total corrections: {grammarResult.stats.totalCorrections}</span>
+                <span>Grammar: {grammarResult.stats.grammarErrors}</span>
+                <span>Spelling: {grammarResult.stats.spellingErrors}</span>
+                <span>Punctuation: {grammarResult.stats.punctuationErrors}</span>
+                <span>Style: {grammarResult.stats.styleIssues}</span>
+              </div>
+            </div>
+          )}
+
+          {/* Tone Results */}
+          {toneResult && (
+            <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+              <h2 className="text-lg font-semibold text-neutral-900">Tone Adjusted ({selectedTone})</h2>
+              <div className="mt-3 rounded-lg border border-neutral-200 bg-neutral-50 p-4 text-sm">
+                <pre className="whitespace-pre-wrap font-mono">{toneResult}</pre>
+              </div>
+              <div className="mt-2 text-xs text-neutral-500">{toneResult.length} characters</div>
+            </div>
+          )}
+
+          {/* Key Points Results */}
+          {keyPointsResult && (
+            <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+              <h2 className="text-lg font-semibold text-neutral-900">Key Points Extracted</h2>
+              <ul className="mt-3 space-y-2">
+                {keyPointsResult.map((point, idx) => (
+                  <li key={idx} className="flex items-start gap-2">
+                    <span className={`inline-block h-2 w-2 rounded-full mt-1.5 flex-shrink-0 ${
+                      point.importance === 'primary' ? 'bg-primary-600' :
+                      point.importance === 'secondary' ? 'bg-primary-400' :
+                      'bg-neutral-400'
+                    }`}></span>
+                    <span className="text-sm text-neutral-800">{point.point}</span>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          )}
+
+          {/* Expanded Results */}
+          {expandedResult && (
+            <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+              <h2 className="text-lg font-semibold text-neutral-900">Expanded Text</h2>
+              <div className="mt-3 rounded-lg border border-neutral-200 bg-neutral-50 p-4 text-sm">
+                <pre className="whitespace-pre-wrap font-mono">{expandedResult}</pre>
+              </div>
+              <div className="mt-2 text-xs text-neutral-500">
+                {inputText.length} → {expandedResult.length} characters ({Math.round((expandedResult.length / inputText.length) * 100)}% of original)
+              </div>
+            </div>
+          )}
+
+          {/* Suggestions Results */}
+          {suggestionsResult && (
+            <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+              <h2 className="text-lg font-semibold text-neutral-900">Writing Suggestions</h2>
+              <div className="mt-3 space-y-3">
+                {suggestionsResult.map((suggestion, idx) => (
+                  <div key={idx} className="rounded-lg border border-neutral-200 p-4">
+                    <div className="flex items-start gap-2">
+                      <span className={`inline-block rounded px-2 py-0.5 text-xs font-medium ${
+                        suggestion.priority === 'high' ? 'bg-red-100 text-red-800' :
+                        suggestion.priority === 'medium' ? 'bg-yellow-100 text-yellow-800' :
+                        'bg-neutral-100 text-neutral-800'
+                      }`}>
+                        {suggestion.category}
+                      </span>
+                    </div>
+                    <p className="mt-2 text-sm font-medium text-neutral-900">{suggestion.issue}</p>
+                    <p className="mt-1 text-sm text-neutral-700">{suggestion.suggestion}</p>
+                    {suggestion.example && (
+                      <div className="mt-2 rounded bg-neutral-50 p-2">
+                        <p className="text-xs text-neutral-600">{suggestion.example}</p>
+                      </div>
+                    )}
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+
+          {/* Combined Results */}
+          {combinedResult && (
+            <div className="rounded-lg border border-green-200 bg-green-50 p-6 shadow-sm">
+              <h2 className="text-lg font-semibold text-green-900">Combined Enhancement Results</h2>
+              <div className="mt-3 space-y-3 text-sm text-green-800">
+                {combinedResult.corrected && <p>✓ Grammar corrected</p>}
+                {combinedResult.toneAdjusted && <p>✓ Tone adjusted to {selectedTone}</p>}
+                {combinedResult.keyPoints && <p>✓ {combinedResult.keyPoints.length} key points extracted</p>}
+                {combinedResult.suggestions && <p>✓ {combinedResult.suggestions.length} suggestions provided</p>}
+              </div>
+            </div>
+          )}
+        </div>
+      )}
+
+      {/* Logs */}
+      <div className="rounded-lg border border-neutral-200 bg-white p-6 shadow-sm">
+        <h2 className="text-lg font-semibold text-neutral-900">Event Log</h2>
+        <div className="mt-3 max-h-64 overflow-y-auto rounded-lg border border-neutral-200 bg-neutral-50 p-3">
+          {logs.length === 0 ? (
+            <p className="text-sm text-neutral-500">No events yet</p>
+          ) : (
+            <ul className="space-y-1 text-xs font-mono">
+              {logs.map((log, i) => (
+                <li key={i} className="text-neutral-700">
+                  {log}
+                </li>
+              ))}
+            </ul>
+          )}
+        </div>
+      </div>
+    </div>
+  )
+}
+
+const DEFAULT_TEST_TEXT = `The implementation of AI technology in modern software development has become increasingly prevalent. However, many developers struggle to understand the nuances of different AI models and their appropriate use cases. This article explores best practices for integrating AI into production systems, including considerations for latency, cost, and user experience.`
+
+const QUICK_TEST_PROMPTS = [
+  'AI is transforming software development.',
+  'Draft blog post about climate change and renewable energy',
+  'Explain machine learning to beginners in simple terms',
+]
diff --git a/src/components/writing/WritingEnhancementPanel.tsx b/src/components/writing/WritingEnhancementPanel.tsx
new file mode 100644
index 0000000..f349ef4
--- /dev/null
+++ b/src/components/writing/WritingEnhancementPanel.tsx
@@ -0,0 +1,483 @@
+import { useState, useEffect } from 'react'
+import { useWritingEnhancement } from '@/hooks/useWritingEnhancement'
+import { detectChromeAiCapabilities } from '@/lib/chrome-ai/capabilities'
+import type { WritingEnhancementResult } from '@/lib/chrome-ai/services/WritingEnhancementService'
+
+type EnhancementType = 'grammar' | 'tone' | 'keypoints' | 'expand' | 'suggestions'
+
+interface FeatureAvailability {
+  grammar: boolean
+  tone: boolean
+  keypoints: boolean
+  expand: boolean
+  suggestions: boolean
+}
+
+export const WritingEnhancementPanel = () => {
+  const [inputText, setInputText] = useState('')
+  const [selectedEnhancements, setSelectedEnhancements] = useState<Set<EnhancementType>>(
+    new Set(['keypoints', 'suggestions'])
+  )
+  const [selectedTone, setSelectedTone] = useState<'professional' | 'casual' | 'academic' | 'simple'>('professional')
+  const [result, setResult] = useState<WritingEnhancementResult | null>(null)
+  const [featureAvailability, setFeatureAvailability] = useState<FeatureAvailability>({
+    grammar: false,
+    tone: false,
+    keypoints: true,
+    expand: false,
+    suggestions: true,
+  })
+
+  const {
+    isReady,
+    isInitializing,
+    isProcessing,
+    error,
+    enhanceText,
+    clearError,
+  } = useWritingEnhancement(true)
+
+  // Detect feature availability on mount
+  useEffect(() => {
+    const capabilities = detectChromeAiCapabilities()
+    setFeatureAvailability({
+      grammar: capabilities.proofreader,
+      tone: capabilities.writer || capabilities.rewriter,
+      keypoints: capabilities.prompt,
+      expand: capabilities.writer,
+      suggestions: capabilities.prompt,
+    })
+  }, [])
+
+  const handleEnhance = async () => {
+    if (!inputText.trim()) return
+
+    // Clear previous results
+    setResult(null)
+
+    try {
+      console.log('Starting enhancement with options:', {
+        correctGrammar: selectedEnhancements.has('grammar') && featureAvailability.grammar,
+        extractKeyPoints: selectedEnhancements.has('keypoints') && featureAvailability.keypoints,
+        getSuggestions: selectedEnhancements.has('suggestions') && featureAvailability.suggestions,
+        adjustTone: selectedEnhancements.has('tone') && featureAvailability.tone ? selectedTone : undefined,
+        expand: selectedEnhancements.has('expand') && featureAvailability.expand,
+      })
+
+      const enhancementResult = await enhanceText(inputText, {
+        correctGrammar: selectedEnhancements.has('grammar') && featureAvailability.grammar,
+        extractKeyPoints: selectedEnhancements.has('keypoints') && featureAvailability.keypoints,
+        getSuggestions: selectedEnhancements.has('suggestions') && featureAvailability.suggestions,
+        adjustTone: selectedEnhancements.has('tone') && featureAvailability.tone ? selectedTone : undefined,
+        expand: selectedEnhancements.has('expand') && featureAvailability.expand,
+      })
+
+      console.log('Enhancement completed:', enhancementResult)
+      setResult(enhancementResult)
+    } catch (err) {
+      console.error('Enhancement failed:', err)
+      // Error is already handled by the hook
+    }
+  }
+
+  const getFeatureRequirement = (feature: EnhancementType): string => {
+    switch (feature) {
+      case 'grammar':
+        return 'Requires Proofreader API (Chrome 137+ with chrome://flags/#writer-api)'
+      case 'tone':
+      case 'expand':
+        return 'Requires Writer API (Chrome 137+ with chrome://flags/#writer-api)'
+      case 'keypoints':
+      case 'suggestions':
+        return 'Requires Prompt API (Chrome 137+ with chrome://flags/#prompt-api-for-gemini-nano)'
+      default:
+        return ''
+    }
+  }
+
+  const toggleEnhancement = (type: EnhancementType) => {
+    setSelectedEnhancements((prev) => {
+      const next = new Set(prev)
+      if (next.has(type)) {
+        next.delete(type)
+      } else {
+        next.add(type)
+      }
+      return next
+    })
+  }
+
+  if (!isReady && !isInitializing) {
+    return (
+      <div className="rounded-xl border border-neutral-200 bg-white p-8 text-center">
+        <p className="text-neutral-600">Writing enhancement is not available in this browser.</p>
+        <p className="mt-2 text-sm text-neutral-500">
+          Chrome AI APIs are required. Please use Chrome Canary with the appropriate flags enabled.
+        </p>
+      </div>
+    )
+  }
+
+  if (isInitializing) {
+    return (
+      <div className="rounded-xl border border-neutral-200 bg-white p-8 text-center">
+        <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-neutral-200 border-t-primary-600"></div>
+        <p className="mt-4 text-neutral-600">Initializing writing enhancement...</p>
+      </div>
+    )
+  }
+
+  const availableCount = Object.values(featureAvailability).filter(Boolean).length
+  const totalCount = Object.keys(featureAvailability).length
+  const hasAnyUnavailable = availableCount < totalCount
+
+  return (
+    <div className="grid gap-6">
+      {/* Feature Availability Banner */}
+      {hasAnyUnavailable && (
+        <div className="rounded-xl border border-blue-200 bg-blue-50 p-4">
+          <div className="flex items-start gap-3">
+            <svg className="h-5 w-5 text-blue-600 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
+              <path fillRule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clipRule="evenodd" />
+            </svg>
+            <div className="flex-1">
+              <p className="font-medium text-blue-900">
+                {availableCount} of {totalCount} features available
+              </p>
+              <p className="mt-1 text-sm text-blue-700">
+                Some features require additional Chrome AI APIs. You can still use available features.
+                {!featureAvailability.grammar && !featureAvailability.expand && (
+                  <> Enable Writer and Proofreader APIs in Chrome 137+ to unlock all features.</>
+                )}
+              </p>
+              <a
+                href="https://github.com/simandebvu/synapse/blob/main/docs/SETUP.md"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="mt-2 inline-flex items-center gap-1 text-sm font-medium text-blue-800 hover:text-blue-900 underline"
+              >
+                View setup guide
+                <svg className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+                </svg>
+              </a>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {/* Input Section */}
+      <div className="rounded-xl border border-neutral-200 bg-white p-6">
+        <label htmlFor="writing-input" className="block text-sm font-semibold text-neutral-700">
+          Enter text to enhance
+        </label>
+        <textarea
+          id="writing-input"
+          value={inputText}
+          onChange={(e) => setInputText(e.target.value)}
+          disabled={isProcessing}
+          placeholder="Paste or type your text here..."
+          className="mt-2 w-full rounded-lg border border-neutral-300 p-4 font-mono text-sm focus:border-primary-500 focus:outline-none focus:ring-2 focus:ring-primary-100 disabled:cursor-not-allowed disabled:opacity-60 disabled:bg-neutral-50"
+          rows={8}
+        />
+      </div>
+
+      {/* Enhancement Options */}
+      <div className="rounded-xl border border-neutral-200 bg-white p-6">
+        <h3 className="text-sm font-semibold text-neutral-700">Enhancement Options</h3>
+        <div className="mt-4 grid gap-3">
+          <label className={`flex items-center gap-3 ${featureAvailability.grammar && !isProcessing ? 'cursor-pointer' : 'cursor-not-allowed opacity-60'}`}>
+            <input
+              type="checkbox"
+              checked={selectedEnhancements.has('grammar')}
+              onChange={() => toggleEnhancement('grammar')}
+              disabled={!featureAvailability.grammar || isProcessing}
+              className="h-4 w-4 rounded border-neutral-300 text-primary-600 focus:ring-primary-500 disabled:cursor-not-allowed disabled:opacity-50"
+            />
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <span className="font-medium text-neutral-900">Grammar & Spelling</span>
+                {!featureAvailability.grammar && (
+                  <span className="text-xs px-2 py-0.5 rounded-full bg-orange-100 text-orange-700 font-medium">
+                    Unavailable
+                  </span>
+                )}
+              </div>
+              <p className="text-sm text-neutral-600">
+                {featureAvailability.grammar
+                  ? 'Correct errors and improve accuracy'
+                  : getFeatureRequirement('grammar')}
+              </p>
+            </div>
+          </label>
+
+          <label className={`flex items-center gap-3 ${featureAvailability.tone && !isProcessing ? 'cursor-pointer' : 'cursor-not-allowed opacity-60'}`}>
+            <input
+              type="checkbox"
+              checked={selectedEnhancements.has('tone')}
+              onChange={() => toggleEnhancement('tone')}
+              disabled={!featureAvailability.tone || isProcessing}
+              className="h-4 w-4 rounded border-neutral-300 text-primary-600 focus:ring-primary-500 disabled:cursor-not-allowed disabled:opacity-50"
+            />
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <span className="font-medium text-neutral-900">Adjust Tone</span>
+                {!featureAvailability.tone && (
+                  <span className="text-xs px-2 py-0.5 rounded-full bg-orange-100 text-orange-700 font-medium">
+                    Unavailable
+                  </span>
+                )}
+              </div>
+              <p className="text-sm text-neutral-600">
+                {featureAvailability.tone
+                  ? 'Change writing style'
+                  : getFeatureRequirement('tone')}
+              </p>
+            </div>
+          </label>
+
+          {selectedEnhancements.has('tone') && (
+            <div className="ml-7 flex gap-2">
+              {(['professional', 'casual', 'academic', 'simple'] as const).map((tone) => (
+                <button
+                  key={tone}
+                  type="button"
+                  onClick={() => setSelectedTone(tone)}
+                  className={`rounded-lg px-3 py-1 text-sm font-medium transition ${
+                    selectedTone === tone
+                      ? 'bg-primary-600 text-white'
+                      : 'bg-neutral-100 text-neutral-700 hover:bg-neutral-200'
+                  }`}
+                >
+                  {tone.charAt(0).toUpperCase() + tone.slice(1)}
+                </button>
+              ))}
+            </div>
+          )}
+
+          <label className={`flex items-center gap-3 ${featureAvailability.keypoints && !isProcessing ? 'cursor-pointer' : 'cursor-not-allowed opacity-60'}`}>
+            <input
+              type="checkbox"
+              checked={selectedEnhancements.has('keypoints')}
+              onChange={() => toggleEnhancement('keypoints')}
+              disabled={!featureAvailability.keypoints || isProcessing}
+              className="h-4 w-4 rounded border-neutral-300 text-primary-600 focus:ring-primary-500 disabled:cursor-not-allowed disabled:opacity-50"
+            />
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <span className="font-medium text-neutral-900">Extract Key Points</span>
+                {!featureAvailability.keypoints && (
+                  <span className="text-xs px-2 py-0.5 rounded-full bg-orange-100 text-orange-700 font-medium">
+                    Unavailable
+                  </span>
+                )}
+              </div>
+              <p className="text-sm text-neutral-600">
+                {featureAvailability.keypoints
+                  ? 'Identify main ideas for summaries'
+                  : getFeatureRequirement('keypoints')}
+              </p>
+            </div>
+          </label>
+
+          <label className={`flex items-center gap-3 ${featureAvailability.expand && !isProcessing ? 'cursor-pointer' : 'cursor-not-allowed opacity-60'}`}>
+            <input
+              type="checkbox"
+              checked={selectedEnhancements.has('expand')}
+              onChange={() => toggleEnhancement('expand')}
+              disabled={!featureAvailability.expand || isProcessing}
+              className="h-4 w-4 rounded border-neutral-300 text-primary-600 focus:ring-primary-500 disabled:cursor-not-allowed disabled:opacity-50"
+            />
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <span className="font-medium text-neutral-900">Expand Text</span>
+                {!featureAvailability.expand && (
+                  <span className="text-xs px-2 py-0.5 rounded-full bg-orange-100 text-orange-700 font-medium">
+                    Unavailable
+                  </span>
+                )}
+              </div>
+              <p className="text-sm text-neutral-600">
+                {featureAvailability.expand
+                  ? 'Add more detail and elaboration'
+                  : getFeatureRequirement('expand')}
+              </p>
+            </div>
+          </label>
+
+          <label className={`flex items-center gap-3 ${featureAvailability.suggestions && !isProcessing ? 'cursor-pointer' : 'cursor-not-allowed opacity-60'}`}>
+            <input
+              type="checkbox"
+              checked={selectedEnhancements.has('suggestions')}
+              onChange={() => toggleEnhancement('suggestions')}
+              disabled={!featureAvailability.suggestions || isProcessing}
+              className="h-4 w-4 rounded border-neutral-300 text-primary-600 focus:ring-primary-500 disabled:cursor-not-allowed disabled:opacity-50"
+            />
+            <div className="flex-1">
+              <div className="flex items-center gap-2">
+                <span className="font-medium text-neutral-900">Writing Suggestions</span>
+                {!featureAvailability.suggestions && (
+                  <span className="text-xs px-2 py-0.5 rounded-full bg-orange-100 text-orange-700 font-medium">
+                    Unavailable
+                  </span>
+                )}
+              </div>
+              <p className="text-sm text-neutral-600">
+                {featureAvailability.suggestions
+                  ? 'Get actionable improvement tips'
+                  : getFeatureRequirement('suggestions')}
+              </p>
+            </div>
+          </label>
+        </div>
+
+        <button
+          type="button"
+          onClick={handleEnhance}
+          disabled={!inputText.trim() || isProcessing || selectedEnhancements.size === 0}
+          className="mt-6 w-full rounded-lg bg-primary-600 px-6 py-3 font-semibold text-white transition hover:bg-primary-700 disabled:cursor-not-allowed disabled:opacity-50"
+        >
+          {isProcessing ? 'Enhancing...' : 'Enhance Text'}
+        </button>
+      </div>
+
+      {/* Error Display */}
+      {error && (
+        <div className="rounded-xl border border-red-200 bg-red-50 p-4">
+          <div className="flex items-start gap-3">
+            <svg className="h-5 w-5 text-red-600 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
+              <path fillRule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clipRule="evenodd" />
+            </svg>
+            <div className="flex-1">
+              <p className="font-medium text-red-900">Enhancement failed</p>
+              <p className="mt-1 text-sm text-red-700 whitespace-pre-wrap">{error.message}</p>
+              {error.message.includes('chrome://flags') && (
+                <div className="mt-3 space-y-2">
+                  <a
+                    href="chrome://flags"
+                    className="inline-flex items-center gap-1 text-sm font-medium text-red-800 hover:text-red-900 underline"
+                  >
+                    Open Chrome Flags
+                    <svg className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
+                    </svg>
+                  </a>
+                  <p className="text-xs text-red-600">
+                    Need help? See the{' '}
+                    <a
+                      href="https://github.com/simandebvu/synapse/blob/main/docs/SETUP.md"
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      className="underline font-medium"
+                    >
+                      setup guide
+                    </a>
+                    {' '}for step-by-step instructions.
+                  </p>
+                </div>
+              )}
+            </div>
+            <button
+              type="button"
+              onClick={clearError}
+              className="text-red-600 hover:text-red-800"
+            >
+              <svg className="h-5 w-5" fill="currentColor" viewBox="0 0 20 20">
+                <path fillRule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clipRule="evenodd" />
+              </svg>
+            </button>
+          </div>
+        </div>
+      )}
+
+      {/* Results Display */}
+      {result && (
+        <div className="grid gap-4">
+          {result.corrected && result.corrections && (
+            <div className="rounded-xl border border-neutral-200 bg-white p-6">
+              <h3 className="font-semibold text-neutral-900">Grammar & Spelling</h3>
+              <div className="mt-4 rounded-lg bg-neutral-50 p-4">
+                <p className="text-sm text-neutral-800 whitespace-pre-wrap">{result.corrected}</p>
+              </div>
+              <div className="mt-4 flex gap-4 text-sm">
+                <span className="text-neutral-600">
+                  {result.corrections.stats.totalCorrections} corrections
+                </span>
+                <span className="text-neutral-600">
+                  {result.corrections.stats.grammarErrors} grammar
+                </span>
+                <span className="text-neutral-600">
+                  {result.corrections.stats.spellingErrors} spelling
+                </span>
+              </div>
+            </div>
+          )}
+
+          {result.toneAdjusted && (
+            <div className="rounded-xl border border-neutral-200 bg-white p-6">
+              <h3 className="font-semibold text-neutral-900">Tone Adjusted ({selectedTone})</h3>
+              <div className="mt-4 rounded-lg bg-neutral-50 p-4">
+                <p className="text-sm text-neutral-800 whitespace-pre-wrap">{result.toneAdjusted}</p>
+              </div>
+            </div>
+          )}
+
+          {result.keyPoints && result.keyPoints.length > 0 && (
+            <div className="rounded-xl border border-neutral-200 bg-white p-6">
+              <h3 className="font-semibold text-neutral-900">Key Points</h3>
+              <ul className="mt-4 space-y-2">
+                {result.keyPoints.map((point, idx) => (
+                  <li key={idx} className="flex items-start gap-2">
+                    <span className={`inline-block h-2 w-2 rounded-full mt-1.5 flex-shrink-0 ${
+                      point.importance === 'primary' ? 'bg-primary-600' :
+                      point.importance === 'secondary' ? 'bg-primary-400' :
+                      'bg-neutral-400'
+                    }`}></span>
+                    <span className="text-sm text-neutral-800">{point.point}</span>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          )}
+
+          {result.expanded && (
+            <div className="rounded-xl border border-neutral-200 bg-white p-6">
+              <h3 className="font-semibold text-neutral-900">Expanded Text</h3>
+              <div className="mt-4 rounded-lg bg-neutral-50 p-4">
+                <p className="text-sm text-neutral-800 whitespace-pre-wrap">{result.expanded}</p>
+              </div>
+            </div>
+          )}
+
+          {result.suggestions && result.suggestions.length > 0 && (
+            <div className="rounded-xl border border-neutral-200 bg-white p-6">
+              <h3 className="font-semibold text-neutral-900">Writing Suggestions</h3>
+              <div className="mt-4 space-y-3">
+                {result.suggestions.map((suggestion, idx) => (
+                  <div key={idx} className="rounded-lg border border-neutral-200 p-4">
+                    <div className="flex items-start gap-2">
+                      <span className={`inline-block rounded px-2 py-0.5 text-xs font-medium ${
+                        suggestion.priority === 'high' ? 'bg-red-100 text-red-800' :
+                        suggestion.priority === 'medium' ? 'bg-yellow-100 text-yellow-800' :
+                        'bg-neutral-100 text-neutral-800'
+                      }`}>
+                        {suggestion.category}
+                      </span>
+                    </div>
+                    <p className="mt-2 text-sm font-medium text-neutral-900">{suggestion.issue}</p>
+                    <p className="mt-1 text-sm text-neutral-700">{suggestion.suggestion}</p>
+                    {suggestion.example && (
+                      <div className="mt-2 rounded bg-neutral-50 p-2">
+                        <p className="text-xs text-neutral-600">{suggestion.example}</p>
+                      </div>
+                    )}
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+        </div>
+      )}
+    </div>
+  )
+}
diff --git a/src/hooks/useProofreader.ts b/src/hooks/useProofreader.ts
new file mode 100644
index 0000000..9acf191
--- /dev/null
+++ b/src/hooks/useProofreader.ts
@@ -0,0 +1,237 @@
+import { useCallback, useEffect, useRef, useState } from 'react'
+import {
+  checkProofreaderAvailability,
+  createProofreader,
+  destroyProofreader,
+  proofreadText,
+} from '@/lib/chrome-ai/proofreader'
+import type {
+  AICapabilityAvailability,
+  AIProofreader,
+  AIProofreaderCreateOptions,
+  ProofreadResult,
+} from '@/lib/chrome-ai/types'
+
+export interface UseProofreaderState {
+  /** Current availability status of the Proofreader API */
+  availability: AICapabilityAvailability | null
+
+  /** Whether the proofreader is being initialized */
+  isInitializing: boolean
+
+  /** Whether a proofread operation is in progress */
+  isProofreading: boolean
+
+  /** Whether the API is ready to use (available) */
+  isReady: boolean
+
+  /** Error from the last operation, if any */
+  error: Error | null
+
+  /** Download progress for model (when availability is 'downloadable') */
+  downloadProgress: { loaded: number; total: number } | null
+}
+
+export interface UseProofreaderActions {
+  /** Initialize the proofreader with options */
+  initialize: (options?: AIProofreaderCreateOptions) => Promise<void>
+
+  /** Proofread text and return corrections */
+  proofread: (input: string) => Promise<ProofreadResult>
+
+  /** Destroy the current proofreader instance */
+  destroy: () => void
+
+  /** Clear the current error */
+  clearError: () => void
+}
+
+export type UseProofreaderReturn = UseProofreaderState & UseProofreaderActions
+
+/**
+ * React hook for using the Chrome Proofreader API
+ *
+ * @param autoInitialize - Whether to automatically initialize the proofreader on mount
+ * @param createOptions - Default options for creating the proofreader
+ * @returns State and actions for using the proofreader
+ *
+ * @example
+ * ```tsx
+ * const { isReady, proofread } = useProofreader(true, {
+ *   expectedInputLanguages: ['en']
+ * })
+ *
+ * // Proofread text
+ * const result = await proofread('Text with erors')
+ * console.log(result.corrected) // 'Text with errors'
+ * console.log(result.corrections.length) // 1
+ * ```
+ */
+export const useProofreader = (
+  autoInitialize = false,
+  createOptions?: AIProofreaderCreateOptions
+): UseProofreaderReturn => {
+  const [state, setState] = useState<UseProofreaderState>({
+    availability: null,
+    isInitializing: false,
+    isProofreading: false,
+    isReady: false,
+    error: null,
+    downloadProgress: null,
+  })
+
+  const proofreaderRef = useRef<AIProofreader | null>(null)
+  const abortControllerRef = useRef<AbortController | null>(null)
+
+  // Check availability on mount
+  useEffect(() => {
+    const checkAvailability = async () => {
+      try {
+        const availability = await checkProofreaderAvailability()
+        setState((prev) => ({
+          ...prev,
+          availability,
+          isReady: availability === 'available',
+        }))
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error : new Error('Failed to check availability'),
+        }))
+      }
+    }
+
+    checkAvailability()
+  }, [])
+
+  // Auto-initialize if requested
+  useEffect(() => {
+    if (autoInitialize && state.availability === 'available' && !proofreaderRef.current) {
+      initialize(createOptions).catch((error) => {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error : new Error('Auto-initialization failed'),
+        }))
+      })
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [autoInitialize, state.availability])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (proofreaderRef.current) {
+        destroyProofreader(proofreaderRef.current)
+        proofreaderRef.current = null
+      }
+      if (abortControllerRef.current) {
+        abortControllerRef.current.abort()
+        abortControllerRef.current = null
+      }
+    }
+  }, [])
+
+  const initialize = useCallback(
+    async (options?: AIProofreaderCreateOptions) => {
+      // Clean up existing proofreader
+      if (proofreaderRef.current) {
+        destroyProofreader(proofreaderRef.current)
+        proofreaderRef.current = null
+      }
+
+      setState((prev) => ({
+        ...prev,
+        isInitializing: true,
+        error: null,
+        downloadProgress: null,
+      }))
+
+      const abortController = new AbortController()
+      abortControllerRef.current = abortController
+
+      try {
+        const mergedOptions: AIProofreaderCreateOptions = {
+          ...options,
+          signal: abortController.signal,
+          monitor: (progress) => {
+            setState((prev) => ({
+              ...prev,
+              downloadProgress: progress,
+            }))
+            options?.monitor?.(progress)
+          },
+        }
+
+        const proofreader = await createProofreader(mergedOptions)
+        proofreaderRef.current = proofreader
+
+        setState((prev) => ({
+          ...prev,
+          isInitializing: false,
+          isReady: true,
+          downloadProgress: null,
+        }))
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isInitializing: false,
+          isReady: false,
+          error: error instanceof Error ? error : new Error('Failed to initialize proofreader'),
+          downloadProgress: null,
+        }))
+        throw error
+      } finally {
+        abortControllerRef.current = null
+      }
+    },
+    []
+  )
+
+  const proofread = useCallback(
+    async (input: string): Promise<ProofreadResult> => {
+      if (!proofreaderRef.current) {
+        throw new Error('Proofreader not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProofreading: true, error: null }))
+
+      try {
+        const result = await proofreadText(proofreaderRef.current, input)
+        setState((prev) => ({ ...prev, isProofreading: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProofreading: false,
+          error: error instanceof Error ? error : new Error('Failed to proofread text'),
+        }))
+        throw error
+      }
+    },
+    []
+  )
+
+  const destroy = useCallback(() => {
+    if (proofreaderRef.current) {
+      destroyProofreader(proofreaderRef.current)
+      proofreaderRef.current = null
+    }
+    setState((prev) => ({
+      ...prev,
+      isReady: false,
+      isProofreading: false,
+    }))
+  }, [])
+
+  const clearError = useCallback(() => {
+    setState((prev) => ({ ...prev, error: null }))
+  }, [])
+
+  return {
+    ...state,
+    initialize,
+    proofread,
+    destroy,
+    clearError,
+  }
+}
diff --git a/src/hooks/useWriter.ts b/src/hooks/useWriter.ts
new file mode 100644
index 0000000..b317ede
--- /dev/null
+++ b/src/hooks/useWriter.ts
@@ -0,0 +1,282 @@
+import { useCallback, useEffect, useRef, useState } from 'react'
+import {
+  checkWriterAvailability,
+  createWriter,
+  destroyWriter,
+  writeText,
+  writeTextStreaming,
+} from '@/lib/chrome-ai/writer'
+import type {
+  AICapabilityAvailability,
+  AIWriter,
+  AIWriterCreateOptions,
+  AIWriteOptions,
+} from '@/lib/chrome-ai/types'
+
+export interface UseWriterState {
+  /** Current availability status of the Writer API */
+  availability: AICapabilityAvailability | null
+
+  /** Whether the writer is being initialized */
+  isInitializing: boolean
+
+  /** Whether a write operation is in progress */
+  isWriting: boolean
+
+  /** Whether the API is ready to use (available) */
+  isReady: boolean
+
+  /** Error from the last operation, if any */
+  error: Error | null
+
+  /** Download progress for model (when availability is 'downloadable') */
+  downloadProgress: { loaded: number; total: number } | null
+}
+
+export interface UseWriterActions {
+  /** Initialize the writer with options */
+  initialize: (options?: AIWriterCreateOptions) => Promise<void>
+
+  /** Generate text without streaming */
+  write: (input: string, options?: AIWriteOptions) => Promise<string>
+
+  /** Generate text with streaming, calling callback with each chunk */
+  writeStream: (
+    input: string,
+    onChunk: (chunk: string) => void,
+    options?: AIWriteOptions
+  ) => Promise<void>
+
+  /** Destroy the current writer instance */
+  destroy: () => void
+
+  /** Clear the current error */
+  clearError: () => void
+}
+
+export type UseWriterReturn = UseWriterState & UseWriterActions
+
+/**
+ * React hook for using the Chrome Writer API
+ *
+ * @param autoInitialize - Whether to automatically initialize the writer on mount
+ * @param createOptions - Default options for creating the writer
+ * @returns State and actions for using the writer
+ *
+ * @example
+ * ```tsx
+ * const { isReady, write, writeStream } = useWriter(true, {
+ *   tone: 'neutral',
+ *   length: 'medium'
+ * })
+ *
+ * // Non-streaming
+ * const result = await write('Brief outline for blog post')
+ *
+ * // Streaming
+ * await writeStream('Expand this intro', (chunk) => {
+ *   console.log(chunk)
+ * })
+ * ```
+ */
+export const useWriter = (
+  autoInitialize = false,
+  createOptions?: AIWriterCreateOptions
+): UseWriterReturn => {
+  const [state, setState] = useState<UseWriterState>({
+    availability: null,
+    isInitializing: false,
+    isWriting: false,
+    isReady: false,
+    error: null,
+    downloadProgress: null,
+  })
+
+  const writerRef = useRef<AIWriter | null>(null)
+  const abortControllerRef = useRef<AbortController | null>(null)
+
+  // Check availability on mount
+  useEffect(() => {
+    const checkAvailability = async () => {
+      try {
+        const availability = await checkWriterAvailability()
+        setState((prev) => ({
+          ...prev,
+          availability,
+          isReady: availability === 'available',
+        }))
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error : new Error('Failed to check availability'),
+        }))
+      }
+    }
+
+    checkAvailability()
+  }, [])
+
+  // Auto-initialize if requested
+  useEffect(() => {
+    if (autoInitialize && state.availability === 'available' && !writerRef.current) {
+      initialize(createOptions).catch((error) => {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error : new Error('Auto-initialization failed'),
+        }))
+      })
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [autoInitialize, state.availability])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (writerRef.current) {
+        destroyWriter(writerRef.current)
+        writerRef.current = null
+      }
+      if (abortControllerRef.current) {
+        abortControllerRef.current.abort()
+        abortControllerRef.current = null
+      }
+    }
+  }, [])
+
+  const initialize = useCallback(
+    async (options?: AIWriterCreateOptions) => {
+      // Clean up existing writer
+      if (writerRef.current) {
+        destroyWriter(writerRef.current)
+        writerRef.current = null
+      }
+
+      setState((prev) => ({
+        ...prev,
+        isInitializing: true,
+        error: null,
+        downloadProgress: null,
+      }))
+
+      const abortController = new AbortController()
+      abortControllerRef.current = abortController
+
+      try {
+        const mergedOptions: AIWriterCreateOptions = {
+          ...options,
+          signal: abortController.signal,
+          monitor: (progress) => {
+            setState((prev) => ({
+              ...prev,
+              downloadProgress: progress,
+            }))
+            options?.monitor?.(progress)
+          },
+        }
+
+        const writer = await createWriter(mergedOptions)
+        writerRef.current = writer
+
+        setState((prev) => ({
+          ...prev,
+          isInitializing: false,
+          isReady: true,
+          downloadProgress: null,
+        }))
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isInitializing: false,
+          isReady: false,
+          error: error instanceof Error ? error : new Error('Failed to initialize writer'),
+          downloadProgress: null,
+        }))
+        throw error
+      } finally {
+        abortControllerRef.current = null
+      }
+    },
+    []
+  )
+
+  const write = useCallback(
+    async (input: string, options?: AIWriteOptions): Promise<string> => {
+      if (!writerRef.current) {
+        throw new Error('Writer not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isWriting: true, error: null }))
+
+      try {
+        const result = await writeText(writerRef.current, input, options)
+        setState((prev) => ({ ...prev, isWriting: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isWriting: false,
+          error: error instanceof Error ? error : new Error('Failed to write text'),
+        }))
+        throw error
+      }
+    },
+    []
+  )
+
+  const writeStream = useCallback(
+    async (
+      input: string,
+      onChunk: (chunk: string) => void,
+      options?: AIWriteOptions
+    ): Promise<void> => {
+      if (!writerRef.current) {
+        throw new Error('Writer not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isWriting: true, error: null }))
+
+      try {
+        const stream = writeTextStreaming(writerRef.current, input, options)
+
+        for await (const chunk of stream) {
+          onChunk(chunk)
+        }
+
+        setState((prev) => ({ ...prev, isWriting: false }))
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isWriting: false,
+          error: error instanceof Error ? error : new Error('Failed to stream write'),
+        }))
+        throw error
+      }
+    },
+    []
+  )
+
+  const destroy = useCallback(() => {
+    if (writerRef.current) {
+      destroyWriter(writerRef.current)
+      writerRef.current = null
+    }
+    setState((prev) => ({
+      ...prev,
+      isReady: false,
+      isWriting: false,
+    }))
+  }, [])
+
+  const clearError = useCallback(() => {
+    setState((prev) => ({ ...prev, error: null }))
+  }, [])
+
+  return {
+    ...state,
+    initialize,
+    write,
+    writeStream,
+    destroy,
+    clearError,
+  }
+}
diff --git a/src/hooks/useWritingEnhancement.ts b/src/hooks/useWritingEnhancement.ts
new file mode 100644
index 0000000..457fa35
--- /dev/null
+++ b/src/hooks/useWritingEnhancement.ts
@@ -0,0 +1,350 @@
+import { useCallback, useEffect, useState } from 'react'
+import { WritingEnhancementService } from '@/lib/chrome-ai/services/WritingEnhancementService'
+import type {
+  WritingSuggestion,
+  KeyPoint,
+  WritingEnhancementResult,
+  EnhanceOptions,
+} from '@/lib/chrome-ai/services/WritingEnhancementService'
+import type { EnhancedProofreadResult } from '@/lib/chrome-ai/services/ProofreaderService'
+
+export interface UseWritingEnhancementState {
+  /** Whether the service is being initialized */
+  isInitializing: boolean
+
+  /** Whether any enhancement operation is in progress */
+  isProcessing: boolean
+
+  /** Whether the service is ready to use */
+  isReady: boolean
+
+  /** Error from the last operation, if any */
+  error: Error | null
+
+  /** Last enhancement result */
+  lastResult: WritingEnhancementResult | null
+}
+
+export interface UseWritingEnhancementActions {
+  /** Initialize the writing enhancement service */
+  initialize: () => Promise<void>
+
+  /** Correct grammar and spelling */
+  correctGrammar: (text: string) => Promise<EnhancedProofreadResult>
+
+  /** Adjust tone of text */
+  adjustTone: (
+    text: string,
+    targetTone: 'professional' | 'casual' | 'academic' | 'simple'
+  ) => Promise<string>
+
+  /** Extract key points from text */
+  extractKeyPoints: (text: string) => Promise<KeyPoint[]>
+
+  /** Expand brief text */
+  expandText: (
+    briefText: string,
+    targetLength?: 'short' | 'medium' | 'long'
+  ) => Promise<string>
+
+  /** Get writing improvement suggestions */
+  getWritingSuggestions: (text: string) => Promise<WritingSuggestion[]>
+
+  /** Perform multiple enhancements at once */
+  enhanceText: (text: string, options: EnhanceOptions) => Promise<WritingEnhancementResult>
+
+  /** Destroy the service and free resources */
+  destroy: () => void
+
+  /** Clear the current error */
+  clearError: () => void
+
+  /** Clear the last result */
+  clearResult: () => void
+}
+
+export type UseWritingEnhancementReturn = UseWritingEnhancementState & UseWritingEnhancementActions
+
+/**
+ * React hook for comprehensive writing enhancement features
+ *
+ * Combines Writer, Proofreader, and Prompt APIs to provide:
+ * - Grammar and spelling correction
+ * - Tone adjustment
+ * - Key point extraction
+ * - Text expansion
+ * - Writing improvement suggestions
+ *
+ * @param autoInitialize - Whether to automatically initialize on mount
+ * @returns State and actions for writing enhancement
+ *
+ * @example
+ * ```tsx
+ * const {
+ *   isReady,
+ *   correctGrammar,
+ *   adjustTone,
+ *   extractKeyPoints,
+ *   expandText,
+ *   getWritingSuggestions,
+ *   enhanceText
+ * } = useWritingEnhancement(true)
+ *
+ * // Single operations
+ * const corrections = await correctGrammar('Text with erors')
+ * const formal = await adjustTone('hey there!', 'professional')
+ * const points = await extractKeyPoints('Long article...')
+ * const expanded = await expandText('Brief intro')
+ * const suggestions = await getWritingSuggestions('Text to improve')
+ *
+ * // Multiple enhancements at once
+ * const result = await enhanceText('Text to enhance', {
+ *   correctGrammar: true,
+ *   extractKeyPoints: true,
+ *   getSuggestions: true
+ * })
+ * ```
+ */
+export const useWritingEnhancement = (
+  autoInitialize = false
+): UseWritingEnhancementReturn => {
+  const [state, setState] = useState<UseWritingEnhancementState>({
+    isInitializing: false,
+    isProcessing: false,
+    isReady: false,
+    error: null,
+    lastResult: null,
+  })
+
+  const [service] = useState(() => new WritingEnhancementService())
+
+  // Auto-initialize if requested
+  useEffect(() => {
+    if (autoInitialize && !state.isReady && !state.isInitializing) {
+      initialize().catch((error) => {
+        setState((prev) => ({
+          ...prev,
+          error: error instanceof Error ? error : new Error('Auto-initialization failed'),
+        }))
+      })
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [autoInitialize])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      service.destroy()
+    }
+  }, [service])
+
+  const initialize = useCallback(async () => {
+    setState((prev) => ({
+      ...prev,
+      isInitializing: true,
+      error: null,
+    }))
+
+    try {
+      await service.initialize()
+      setState((prev) => ({
+        ...prev,
+        isInitializing: false,
+        isReady: true,
+      }))
+    } catch (error) {
+      setState((prev) => ({
+        ...prev,
+        isInitializing: false,
+        isReady: false,
+        error: error instanceof Error ? error : new Error('Failed to initialize service'),
+      }))
+      throw error
+    }
+  }, [service])
+
+  const correctGrammar = useCallback(
+    async (text: string): Promise<EnhancedProofreadResult> => {
+      if (!state.isReady) {
+        throw new Error('Service not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProcessing: true, error: null }))
+
+      try {
+        const result = await service.correctGrammar(text)
+        setState((prev) => ({ ...prev, isProcessing: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          error: error instanceof Error ? error : new Error('Failed to correct grammar'),
+        }))
+        throw error
+      }
+    },
+    [service, state.isReady]
+  )
+
+  const adjustTone = useCallback(
+    async (
+      text: string,
+      targetTone: 'professional' | 'casual' | 'academic' | 'simple'
+    ): Promise<string> => {
+      if (!state.isReady) {
+        throw new Error('Service not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProcessing: true, error: null }))
+
+      try {
+        const result = await service.adjustTone(text, targetTone)
+        setState((prev) => ({ ...prev, isProcessing: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          error: error instanceof Error ? error : new Error('Failed to adjust tone'),
+        }))
+        throw error
+      }
+    },
+    [service, state.isReady]
+  )
+
+  const extractKeyPoints = useCallback(
+    async (text: string): Promise<KeyPoint[]> => {
+      if (!state.isReady) {
+        throw new Error('Service not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProcessing: true, error: null }))
+
+      try {
+        const result = await service.extractKeyPoints(text)
+        setState((prev) => ({ ...prev, isProcessing: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          error: error instanceof Error ? error : new Error('Failed to extract key points'),
+        }))
+        throw error
+      }
+    },
+    [service, state.isReady]
+  )
+
+  const expandText = useCallback(
+    async (
+      briefText: string,
+      targetLength: 'short' | 'medium' | 'long' = 'medium'
+    ): Promise<string> => {
+      if (!state.isReady) {
+        throw new Error('Service not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProcessing: true, error: null }))
+
+      try {
+        const result = await service.expandText(briefText, targetLength)
+        setState((prev) => ({ ...prev, isProcessing: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          error: error instanceof Error ? error : new Error('Failed to expand text'),
+        }))
+        throw error
+      }
+    },
+    [service, state.isReady]
+  )
+
+  const getWritingSuggestions = useCallback(
+    async (text: string): Promise<WritingSuggestion[]> => {
+      if (!state.isReady) {
+        throw new Error('Service not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProcessing: true, error: null }))
+
+      try {
+        const result = await service.getWritingSuggestions(text)
+        setState((prev) => ({ ...prev, isProcessing: false }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          error: error instanceof Error ? error : new Error('Failed to get writing suggestions'),
+        }))
+        throw error
+      }
+    },
+    [service, state.isReady]
+  )
+
+  const enhanceText = useCallback(
+    async (text: string, options: EnhanceOptions): Promise<WritingEnhancementResult> => {
+      if (!state.isReady) {
+        throw new Error('Service not initialized. Call initialize() first.')
+      }
+
+      setState((prev) => ({ ...prev, isProcessing: true, error: null }))
+
+      try {
+        const result = await service.enhanceText(text, options)
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          lastResult: result,
+        }))
+        return result
+      } catch (error) {
+        setState((prev) => ({
+          ...prev,
+          isProcessing: false,
+          error: error instanceof Error ? error : new Error('Failed to enhance text'),
+        }))
+        throw error
+      }
+    },
+    [service, state.isReady]
+  )
+
+  const destroy = useCallback(() => {
+    service.destroy()
+    setState((prev) => ({
+      ...prev,
+      isReady: false,
+      isProcessing: false,
+    }))
+  }, [service])
+
+  const clearError = useCallback(() => {
+    setState((prev) => ({ ...prev, error: null }))
+  }, [])
+
+  const clearResult = useCallback(() => {
+    setState((prev) => ({ ...prev, lastResult: null }))
+  }, [])
+
+  return {
+    ...state,
+    initialize,
+    correctGrammar,
+    adjustTone,
+    extractKeyPoints,
+    expandText,
+    getWritingSuggestions,
+    enhanceText,
+    destroy,
+    clearError,
+    clearResult,
+  }
+}
diff --git a/src/lib/chrome-ai/capabilities.ts b/src/lib/chrome-ai/capabilities.ts
index cbc1f19..b6dc07d 100644
--- a/src/lib/chrome-ai/capabilities.ts
+++ b/src/lib/chrome-ai/capabilities.ts
@@ -10,6 +10,7 @@ export type ChromeAiCapabilities = {
   rewriter: boolean
   translator: boolean
   summarizer: boolean
+  writer: boolean
   proofreader: boolean
 }
 
@@ -22,6 +23,8 @@ export type ChromeAiAvailabilityStatus = {
   rewriter: AICapabilityAvailability
   translator: AICapabilityAvailability
   languageDetector: AICapabilityAvailability
+  writer: AICapabilityAvailability
+  proofreader: AICapabilityAvailability
 }
 
 /**
@@ -41,6 +44,7 @@ const defaultCapabilities: ChromeAiCapabilities = {
   translator: false,
   summarizer: false,
   proofreader: false,
+  writer: false,
 }
 
 /**
@@ -51,6 +55,8 @@ const defaultCapabilities: ChromeAiCapabilities = {
  * - Rewriter API: global `Rewriter` object (self.Rewriter)
  * - Translator API: global `Translator` object (self.Translator)
  * - Language Detector API: global `LanguageDetector` object (self.LanguageDetector)
+ * - Writer API: global `Writer` object (self.Writer)
+ * - Proofreader API: global `Proofreader` object (self.Proofreader)
  * - Summarizer API: global `Summarizer` object (self.Summarizer) [future]
  *
  * @returns Object indicating which APIs are available
@@ -63,14 +69,17 @@ export const detectChromeAiCapabilities = (): ChromeAiCapabilities => {
   const hasRewriter = 'Rewriter' in self && typeof Rewriter !== 'undefined'
   const hasTranslator = 'Translator' in self && typeof Translator !== 'undefined'
   const hasSummarizer = 'Summarizer' in self && typeof Summarizer !== 'undefined'
+  const hasWriter = 'Writer' in self && typeof Writer !== 'undefined'
+  const hasProofreader = 'Proofreader' in self && typeof Proofreader !== 'undefined'
 
   return {
-    available: hasPrompt || hasRewriter || hasTranslator || hasSummarizer,
+    available: hasPrompt || hasRewriter || hasTranslator || hasSummarizer || hasWriter || hasProofreader,
     prompt: hasPrompt,
     rewriter: hasRewriter,
     translator: hasTranslator,
     summarizer: hasSummarizer,
-    proofreader: false, // Not yet available
+    writer: hasWriter,
+    proofreader: hasProofreader,
   }
 }
 
@@ -89,6 +98,8 @@ export const detectChromeAiAvailabilityStatus = async (): Promise<ChromeAiAvaila
     rewriter: 'unavailable',
     translator: 'unavailable',
     languageDetector: 'unavailable',
+    writer: 'unavailable',
+    proofreader: 'unavailable',
   }
 
   // Early return if not in browser environment
@@ -136,6 +147,24 @@ export const detectChromeAiAvailabilityStatus = async (): Promise<ChromeAiAvaila
     // Keep default 'unavailable' status on error
   }
 
+  // Check Writer API
+  try {
+    if ('Writer' in self && typeof Writer !== 'undefined') {
+      status.writer = await Writer.availability()
+    }
+  } catch {
+    // Keep default 'unavailable' status on error
+  }
+
+  // Check Proofreader API
+  try {
+    if ('Proofreader' in self && typeof Proofreader !== 'undefined') {
+      status.proofreader = await Proofreader.availability()
+    }
+  } catch {
+    // Keep default 'unavailable' status on error
+  }
+
   return status
 }
 
diff --git a/src/lib/chrome-ai/errors/ProofreaderError.d.ts b/src/lib/chrome-ai/errors/ProofreaderError.d.ts
new file mode 100644
index 0000000..33a044c
--- /dev/null
+++ b/src/lib/chrome-ai/errors/ProofreaderError.d.ts
@@ -0,0 +1,22 @@
+import type { ProofreaderErrorCode } from '../types'
+
+/**
+ * Custom error class for Proofreader operations
+ */
+export declare class ProofreaderError extends Error {
+  readonly name: 'ProofreaderError'
+  readonly code: ProofreaderErrorCode
+  readonly cause?: unknown
+
+  constructor(message: string, code: ProofreaderErrorCode, cause?: unknown)
+
+  toJSON(): {
+    name: string
+    message: string
+    code: ProofreaderErrorCode
+    cause: unknown
+    stack?: string
+  }
+
+  toString(): string
+}
diff --git a/src/lib/chrome-ai/errors/ProofreaderError.js b/src/lib/chrome-ai/errors/ProofreaderError.js
new file mode 100644
index 0000000..f4c8356
--- /dev/null
+++ b/src/lib/chrome-ai/errors/ProofreaderError.js
@@ -0,0 +1,47 @@
+/**
+ * Custom error class for Proofreader operations
+ * Implemented in JS to bypass TypeScript erasableSyntaxOnly restrictions
+ */
+export class ProofreaderError extends Error {
+  /**
+   * @param {string} message - Error message
+   * @param {string} code - Error code
+   * @param {unknown} [cause] - Original error cause
+   */
+  constructor(message, code, cause) {
+    super(message)
+    this.name = 'ProofreaderError'
+    this.code = code
+    this.cause = cause
+
+    // Maintains proper stack trace for where our error was thrown (only available on V8)
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, ProofreaderError)
+    }
+
+    // Fix prototype chain for instanceof checks in ES5/ES6
+    Object.setPrototypeOf(this, ProofreaderError.prototype)
+  }
+
+  /**
+   * Convert error to JSON representation
+   * @returns {object}
+   */
+  toJSON() {
+    return {
+      name: this.name,
+      message: this.message,
+      code: this.code,
+      cause: this.cause instanceof Error ? this.cause.message : this.cause,
+      stack: this.stack,
+    }
+  }
+
+  /**
+   * Get a human-readable error message
+   * @returns {string}
+   */
+  toString() {
+    return `${this.name} [${this.code}]: ${this.message}`
+  }
+}
diff --git a/src/lib/chrome-ai/errors/WriterError.d.ts b/src/lib/chrome-ai/errors/WriterError.d.ts
new file mode 100644
index 0000000..0144884
--- /dev/null
+++ b/src/lib/chrome-ai/errors/WriterError.d.ts
@@ -0,0 +1,22 @@
+import type { WriterErrorCode } from '../types'
+
+/**
+ * Custom error class for Writer operations
+ */
+export declare class WriterError extends Error {
+  readonly name: 'WriterError'
+  readonly code: WriterErrorCode
+  readonly cause?: unknown
+
+  constructor(message: string, code: WriterErrorCode, cause?: unknown)
+
+  toJSON(): {
+    name: string
+    message: string
+    code: WriterErrorCode
+    cause: unknown
+    stack?: string
+  }
+
+  toString(): string
+}
diff --git a/src/lib/chrome-ai/errors/WriterError.js b/src/lib/chrome-ai/errors/WriterError.js
new file mode 100644
index 0000000..33ce9ef
--- /dev/null
+++ b/src/lib/chrome-ai/errors/WriterError.js
@@ -0,0 +1,47 @@
+/**
+ * Custom error class for Writer operations
+ * Implemented in JS to bypass TypeScript erasableSyntaxOnly restrictions
+ */
+export class WriterError extends Error {
+  /**
+   * @param {string} message - Error message
+   * @param {string} code - Error code
+   * @param {unknown} [cause] - Original error cause
+   */
+  constructor(message, code, cause) {
+    super(message)
+    this.name = 'WriterError'
+    this.code = code
+    this.cause = cause
+
+    // Maintains proper stack trace for where our error was thrown (only available on V8)
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, WriterError)
+    }
+
+    // Fix prototype chain for instanceof checks in ES5/ES6
+    Object.setPrototypeOf(this, WriterError.prototype)
+  }
+
+  /**
+   * Convert error to JSON representation
+   * @returns {object}
+   */
+  toJSON() {
+    return {
+      name: this.name,
+      message: this.message,
+      code: this.code,
+      cause: this.cause instanceof Error ? this.cause.message : this.cause,
+      stack: this.stack,
+    }
+  }
+
+  /**
+   * Get a human-readable error message
+   * @returns {string}
+   */
+  toString() {
+    return `${this.name} [${this.code}]: ${this.message}`
+  }
+}
diff --git a/src/lib/chrome-ai/errors/errorMessages.ts b/src/lib/chrome-ai/errors/errorMessages.ts
index 23f17c4..20d0817 100644
--- a/src/lib/chrome-ai/errors/errorMessages.ts
+++ b/src/lib/chrome-ai/errors/errorMessages.ts
@@ -180,4 +180,24 @@ export const ErrorMessages = {
     promptFailed: (reason?: string) => buildOperationFailedMessage('Prompt', reason),
     aborted: () => buildAbortMessage('Prompt operation'),
   },
+
+  Writer: {
+    notAvailable: () => buildNotAvailableMessage('Writer API', 'writer-api'),
+    notSupported: () => buildNotSupportedMessage('Writer API'),
+    browserOnly: () => buildBrowserOnlyMessage('Writer API'),
+    initFailed: (operation?: string) => buildInitializationFailedMessage('Writer API', operation),
+    emptyInput: () => buildInvalidInputMessage('Input text', 'cannot be empty'),
+    writeFailed: (reason?: string) => buildOperationFailedMessage('Write', reason),
+    aborted: () => buildAbortMessage('Write operation'),
+  },
+
+  Proofreader: {
+    notAvailable: () => buildNotAvailableMessage('Proofreader API', 'proofreader-api'),
+    notSupported: () => buildNotSupportedMessage('Proofreader API'),
+    browserOnly: () => buildBrowserOnlyMessage('Proofreader API'),
+    initFailed: (operation?: string) => buildInitializationFailedMessage('Proofreader API', operation),
+    emptyInput: () => buildInvalidInputMessage('Input text', 'cannot be empty'),
+    proofreadFailed: (reason?: string) => buildOperationFailedMessage('Proofread', reason),
+    aborted: () => buildAbortMessage('Proofread operation'),
+  },
 }
diff --git a/src/lib/chrome-ai/errors/index.ts b/src/lib/chrome-ai/errors/index.ts
index 363c86b..21e3122 100644
--- a/src/lib/chrome-ai/errors/index.ts
+++ b/src/lib/chrome-ai/errors/index.ts
@@ -26,5 +26,27 @@ export {
   isPromptAbortError,
 } from './promptErrorGuards'
 
+// Writer Errors
+export { WriterError } from './WriterError.js'
+export {
+  isWriterError,
+  hasWriterErrorCode,
+  isRetryableWriterError,
+  isWriterAbortError,
+  getWriterErrorMessage,
+  toWriterError,
+} from './writerErrorGuards'
+
+// Proofreader Errors
+export { ProofreaderError } from './ProofreaderError.js'
+export {
+  isProofreaderError,
+  hasProofreaderErrorCode,
+  isRetryableProofreaderError,
+  isProofreaderAbortError,
+  getProofreaderErrorMessage,
+  toProofreaderError,
+} from './proofreaderErrorGuards'
+
 // Error Messages Utilities
 export { ErrorMessages, getSetupInstructions } from './errorMessages'
diff --git a/src/lib/chrome-ai/errors/proofreaderErrorGuards.ts b/src/lib/chrome-ai/errors/proofreaderErrorGuards.ts
new file mode 100644
index 0000000..6ea84ff
--- /dev/null
+++ b/src/lib/chrome-ai/errors/proofreaderErrorGuards.ts
@@ -0,0 +1,92 @@
+import { ProofreaderError } from './ProofreaderError.js'
+import type { ProofreaderErrorCode } from '../types'
+
+/**
+ * Type guard to check if an error is a ProofreaderError
+ * @param error - Error to check
+ * @returns True if error is a ProofreaderError
+ */
+export function isProofreaderError(error: unknown): error is ProofreaderError {
+  return error instanceof ProofreaderError
+}
+
+/**
+ * Type guard to check if an error has a specific code
+ * @param error - Error to check
+ * @param code - Expected error code
+ * @returns True if error is a ProofreaderError with the specified code
+ */
+export function hasProofreaderErrorCode(error: unknown, code: ProofreaderErrorCode): error is ProofreaderError {
+  return isProofreaderError(error) && error.code === code
+}
+
+/**
+ * Check if error is retryable
+ * @param error - Error to check
+ * @returns True if the operation should be retried
+ */
+export function isRetryableProofreaderError(error: unknown): boolean {
+  if (!isProofreaderError(error)) {
+    // Unknown errors might be network issues - retry
+    return true
+  }
+
+  // Don't retry these error codes
+  const nonRetryableErrors: ProofreaderErrorCode[] = [
+    'NOT_SUPPORTED',
+    'INVALID_INPUT',
+    'ABORTED',
+  ]
+
+  return !nonRetryableErrors.includes(error.code)
+}
+
+/**
+ * Check if error is an AbortError
+ * @param error - Error to check
+ * @returns True if error is an abort
+ */
+export function isProofreaderAbortError(error: unknown): boolean {
+  if (error instanceof Error && error.name === 'AbortError') {
+    return true
+  }
+  return hasProofreaderErrorCode(error, 'ABORTED')
+}
+
+/**
+ * Extract error message from unknown error
+ * @param error - Error object
+ * @returns Error message string
+ */
+export function getProofreaderErrorMessage(error: unknown): string {
+  if (isProofreaderError(error)) {
+    return error.message
+  }
+  if (error instanceof Error) {
+    return error.message
+  }
+  if (typeof error === 'string') {
+    return error
+  }
+  return 'An unknown error occurred'
+}
+
+/**
+ * Create a ProofreaderError from an unknown error
+ * @param error - Original error
+ * @param code - Error code to assign
+ * @param message - Optional custom message
+ * @returns ProofreaderError instance
+ */
+export function toProofreaderError(
+  error: unknown,
+  code: ProofreaderErrorCode,
+  message?: string
+): ProofreaderError {
+  if (isProofreaderError(error)) {
+    return error
+  }
+
+  const errorMessage = message || getProofreaderErrorMessage(error)
+  return new ProofreaderError(errorMessage, code, error)
+}
diff --git a/src/lib/chrome-ai/errors/writerErrorGuards.ts b/src/lib/chrome-ai/errors/writerErrorGuards.ts
new file mode 100644
index 0000000..4afc8f6
--- /dev/null
+++ b/src/lib/chrome-ai/errors/writerErrorGuards.ts
@@ -0,0 +1,92 @@
+import { WriterError } from './WriterError.js'
+import type { WriterErrorCode } from '../types'
+
+/**
+ * Type guard to check if an error is a WriterError
+ * @param error - Error to check
+ * @returns True if error is a WriterError
+ */
+export function isWriterError(error: unknown): error is WriterError {
+  return error instanceof WriterError
+}
+
+/**
+ * Type guard to check if an error has a specific code
+ * @param error - Error to check
+ * @param code - Expected error code
+ * @returns True if error is a WriterError with the specified code
+ */
+export function hasWriterErrorCode(error: unknown, code: WriterErrorCode): error is WriterError {
+  return isWriterError(error) && error.code === code
+}
+
+/**
+ * Check if error is retryable
+ * @param error - Error to check
+ * @returns True if the operation should be retried
+ */
+export function isRetryableWriterError(error: unknown): boolean {
+  if (!isWriterError(error)) {
+    // Unknown errors might be network issues - retry
+    return true
+  }
+
+  // Don't retry these error codes
+  const nonRetryableErrors: WriterErrorCode[] = [
+    'NOT_SUPPORTED',
+    'INVALID_INPUT',
+    'ABORTED',
+  ]
+
+  return !nonRetryableErrors.includes(error.code)
+}
+
+/**
+ * Check if error is an AbortError
+ * @param error - Error to check
+ * @returns True if error is an abort
+ */
+export function isWriterAbortError(error: unknown): boolean {
+  if (error instanceof Error && error.name === 'AbortError') {
+    return true
+  }
+  return hasWriterErrorCode(error, 'ABORTED')
+}
+
+/**
+ * Extract error message from unknown error
+ * @param error - Error object
+ * @returns Error message string
+ */
+export function getWriterErrorMessage(error: unknown): string {
+  if (isWriterError(error)) {
+    return error.message
+  }
+  if (error instanceof Error) {
+    return error.message
+  }
+  if (typeof error === 'string') {
+    return error
+  }
+  return 'An unknown error occurred'
+}
+
+/**
+ * Create a WriterError from an unknown error
+ * @param error - Original error
+ * @param code - Error code to assign
+ * @param message - Optional custom message
+ * @returns WriterError instance
+ */
+export function toWriterError(
+  error: unknown,
+  code: WriterErrorCode,
+  message?: string
+): WriterError {
+  if (isWriterError(error)) {
+    return error
+  }
+
+  const errorMessage = message || getWriterErrorMessage(error)
+  return new WriterError(errorMessage, code, error)
+}
diff --git a/src/lib/chrome-ai/index.ts b/src/lib/chrome-ai/index.ts
index dce0c84..7f410e6 100644
--- a/src/lib/chrome-ai/index.ts
+++ b/src/lib/chrome-ai/index.ts
@@ -28,6 +28,30 @@ export type { ImageAnalysisServiceConfig } from './services/ImageAnalysisService
 export { FormatTransformService } from './services/FormatTransformService'
 export type { FormatTransformConfig, TransformOptions } from './services/FormatTransformService'
 
+export { WriterService } from './services/WriterService'
+export type {
+  WriterServiceConfig,
+  WriteOptions,
+  ExpandTextOptions,
+  AdjustToneOptions,
+} from './services/WriterService'
+
+export { ProofreaderService } from './services/ProofreaderService'
+export type {
+  ProofreaderServiceConfig,
+  ProofreadOptions,
+  EnhancedProofreadResult,
+  CorrectionsByType,
+} from './services/ProofreaderService'
+
+export { WritingEnhancementService } from './services/WritingEnhancementService'
+export type {
+  WritingSuggestion,
+  KeyPoint,
+  WritingEnhancementResult,
+  EnhanceOptions,
+} from './services/WritingEnhancementService'
+
 // Core rewriter functions (Low-level API)
 export {
   checkRewriterAvailability,
@@ -66,6 +90,27 @@ export {
   destroySession,
 } from './prompt'
 
+// Core writer functions (Low-level API)
+export {
+  checkWriterAvailability,
+  isWriterReady,
+  createWriter,
+  writeText,
+  writeTextStreaming,
+  destroyWriter,
+  writeWithAutoCleanup,
+} from './writer'
+
+// Core proofreader functions (Low-level API)
+export {
+  checkProofreaderAvailability,
+  isProofreaderReady,
+  createProofreader,
+  proofreadText,
+  destroyProofreader,
+  proofreadWithAutoCleanup,
+} from './proofreader'
+
 // Utilities
 export type { ValidationResult, TextChunk, ChunkerOptions, RetryOptions } from './utils'
 export type { ReadingLevelAnalysis, IdiomNote } from './utils'
@@ -126,6 +171,20 @@ export type {
   ImageAnalysisResult,
   ImageAnalysisBatchResult,
   PromptErrorCode,
+  AIWriterTone,
+  AIWriterFormat,
+  AIWriterLength,
+  AIWriterCreateOptions,
+  AIWriteOptions,
+  AIWriter,
+  AIWriterFactory,
+  WriterErrorCode,
+  AIProofreaderCreateOptions,
+  Correction,
+  ProofreadResult,
+  AIProofreader,
+  AIProofreaderFactory,
+  ProofreaderErrorCode,
   FormatType,
   FormatConfig,
   FormatPreset,
@@ -149,6 +208,16 @@ export {
   isPromptError,
   isRetryablePromptError,
   isPromptAbortError,
+  WriterError,
+  isWriterError,
+  hasWriterErrorCode,
+  isRetryableWriterError,
+  isWriterAbortError,
+  ProofreaderError,
+  isProofreaderError,
+  hasProofreaderErrorCode,
+  isRetryableProofreaderError,
+  isProofreaderAbortError,
 } from './errors'
 
 // Constants and configurations
diff --git a/src/lib/chrome-ai/proofreader.ts b/src/lib/chrome-ai/proofreader.ts
new file mode 100644
index 0000000..187bb3c
--- /dev/null
+++ b/src/lib/chrome-ai/proofreader.ts
@@ -0,0 +1,268 @@
+import { reportError } from '@/lib/errors/report-error'
+import { ProofreaderError, isProofreaderError, isProofreaderAbortError } from './errors'
+import { ErrorMessages } from './errors/errorMessages'
+import type {
+  AICapabilityAvailability,
+  AIProofreader,
+  AIProofreaderCreateOptions,
+  ProofreadResult,
+  Correction,
+} from './types'
+
+/**
+ * Check if the Proofreader API is available in the browser
+ * @returns Promise resolving to availability status
+ * @see https://developer.chrome.com/docs/ai/proofreader-api
+ */
+export const checkProofreaderAvailability = async (): Promise<AICapabilityAvailability> => {
+  try {
+    // Check if we're in a browser environment
+    if (typeof self === 'undefined') {
+      return 'unavailable'
+    }
+
+    // Check if Proofreader API exists (global Proofreader object)
+    if (!('Proofreader' in self) || typeof Proofreader === 'undefined') {
+      return 'unavailable'
+    }
+
+    // Check the availability status
+    const availability = await Proofreader.availability()
+    return availability
+  } catch (error) {
+    reportError({
+      error,
+      context: { operation: 'checkProofreaderAvailability' },
+      severity: 'warning',
+      source: 'chrome-ai:proofreader',
+    })
+    return 'unavailable'
+  }
+}
+
+/**
+ * Check if the Proofreader API is ready to use (without downloading)
+ * @returns Promise resolving to true if immediately available
+ */
+export const isProofreaderReady = async (): Promise<boolean> => {
+  const availability = await checkProofreaderAvailability()
+  return availability === 'available'
+}
+
+/**
+ * Create a Proofreader instance with the specified configuration
+ * @param options - Configuration options for the proofreader
+ * @returns Promise resolving to a Proofreader instance
+ * @throws ProofreaderError if creation fails
+ * @see https://developer.chrome.com/docs/ai/proofreader-api
+ */
+export const createProofreader = async (
+  options?: AIProofreaderCreateOptions
+): Promise<AIProofreader> => {
+  try {
+    // Check if browser environment
+    if (typeof self === 'undefined') {
+      throw new ProofreaderError(ErrorMessages.Proofreader.browserOnly(), 'NOT_SUPPORTED')
+    }
+
+    // Check if Proofreader API exists (global Proofreader object)
+    if (!('Proofreader' in self) || typeof Proofreader === 'undefined') {
+      throw new ProofreaderError(ErrorMessages.Proofreader.notAvailable(), 'NOT_AVAILABLE')
+    }
+
+    // Check availability
+    const availability = await Proofreader.availability()
+
+    if (availability === 'unavailable') {
+      throw new ProofreaderError(ErrorMessages.Proofreader.notSupported(), 'NOT_SUPPORTED')
+    }
+
+    // Create the proofreader instance using global Proofreader
+    const proofreader = await Proofreader.create(options)
+
+    return proofreader
+  } catch (error) {
+    // Handle known ProofreaderError
+    if (isProofreaderError(error)) {
+      reportError({
+        error,
+        context: { operation: 'createProofreader', options },
+        severity: 'error',
+        source: 'chrome-ai:proofreader',
+      })
+      throw error
+    }
+
+    // Handle AbortError
+    if (isProofreaderAbortError(error)) {
+      const abortError = new ProofreaderError(ErrorMessages.Proofreader.aborted(), 'ABORTED', error)
+      reportError({
+        error: abortError,
+        context: { operation: 'createProofreader', options },
+        severity: 'info',
+        source: 'chrome-ai:proofreader',
+      })
+      throw abortError
+    }
+
+    // Handle other errors
+    const wrappedError = new ProofreaderError(
+      ErrorMessages.Proofreader.initFailed('create'),
+      'INITIALIZATION_FAILED',
+      error
+    )
+    reportError({
+      error: wrappedError,
+      context: { operation: 'createProofreader', options },
+      severity: 'error',
+      source: 'chrome-ai:proofreader',
+    })
+    throw wrappedError
+  }
+}
+
+/**
+ * Detect error type based on correction characteristics
+ * @param correction - The correction object
+ * @returns Error type classification
+ */
+const detectErrorType = (correction: Correction): 'grammar' | 'spelling' | 'punctuation' | 'style' => {
+  if (correction.errorType) {
+    return correction.errorType
+  }
+
+  const text = correction.originalText || ''
+  const suggested = correction.suggestedText || ''
+
+  // Punctuation errors typically involve single punctuation characters
+  if (/^[.,;:!?'"()-]/.test(text) || /^[.,;:!?'"()-]/.test(suggested)) {
+    return 'punctuation'
+  }
+
+  // Spelling errors typically involve single words with letter changes
+  if (text.length < 15 && !text.includes(' ') && !suggested.includes(' ')) {
+    return 'spelling'
+  }
+
+  // Style issues typically involve longer phrases or word choice
+  if (text.split(' ').length > 3 || suggested.split(' ').length > 3) {
+    return 'style'
+  }
+
+  // Default to grammar for other cases
+  return 'grammar'
+}
+
+/**
+ * Proofread text and return corrections
+ * @param proofreader - The proofreader instance
+ * @param input - The text to proofread
+ * @returns Promise resolving to the corrected text and list of corrections
+ * @throws ProofreaderError if proofreading fails
+ */
+export const proofreadText = async (
+  proofreader: AIProofreader,
+  input: string
+): Promise<ProofreadResult> => {
+  try {
+    if (!input || input.trim().length === 0) {
+      throw new ProofreaderError(ErrorMessages.Proofreader.emptyInput(), 'INVALID_INPUT')
+    }
+
+    const result = await proofreader.proofread(input)
+
+    // Enhance corrections with error type detection if not provided
+    const enhancedCorrections = result.corrections.map(correction => {
+      if (!correction.errorType) {
+        return {
+          ...correction,
+          errorType: detectErrorType(correction),
+        }
+      }
+      return correction
+    })
+
+    return {
+      ...result,
+      corrections: enhancedCorrections,
+    }
+  } catch (error) {
+    // Handle known ProofreaderError
+    if (isProofreaderError(error)) {
+      reportError({
+        error,
+        context: { operation: 'proofreadText', inputLength: input.length },
+        severity: error.code === 'ABORTED' ? 'info' : 'error',
+        source: 'chrome-ai:proofreader',
+      })
+      throw error
+    }
+
+    // Handle AbortError
+    if (isProofreaderAbortError(error)) {
+      const abortError = new ProofreaderError(ErrorMessages.Proofreader.aborted(), 'ABORTED', error)
+      reportError({
+        error: abortError,
+        context: { operation: 'proofreadText', inputLength: input.length },
+        severity: 'info',
+        source: 'chrome-ai:proofreader',
+      })
+      throw abortError
+    }
+
+    // Handle other errors
+    const wrappedError = new ProofreaderError(
+      ErrorMessages.Proofreader.proofreadFailed(),
+      'PROOFREAD_FAILED',
+      error
+    )
+    reportError({
+      error: wrappedError,
+      context: { operation: 'proofreadText', inputLength: input.length },
+      severity: 'error',
+      source: 'chrome-ai:proofreader',
+    })
+    throw wrappedError
+  }
+}
+
+/**
+ * Destroy a proofreader instance and free resources
+ * @param proofreader - The proofreader instance to destroy
+ */
+export const destroyProofreader = (proofreader: AIProofreader): void => {
+  try {
+    proofreader.destroy()
+  } catch (error) {
+    reportError({
+      error,
+      context: { operation: 'destroyProofreader' },
+      severity: 'warning',
+      source: 'chrome-ai:proofreader',
+    })
+  }
+}
+
+/**
+ * High-level utility to proofread text with automatic instance management
+ * Creates a proofreader, performs the proofreading, and cleans up automatically
+ * @param input - The text to proofread
+ * @param createOptions - Options for creating the proofreader
+ * @returns Promise resolving to the proofread result
+ */
+export const proofreadWithAutoCleanup = async (
+  input: string,
+  createOptions?: AIProofreaderCreateOptions
+): Promise<ProofreadResult> => {
+  let proofreader: AIProofreader | null = null
+
+  try {
+    proofreader = await createProofreader(createOptions)
+    const result = await proofreadText(proofreader, input)
+    return result
+  } finally {
+    if (proofreader) {
+      destroyProofreader(proofreader)
+    }
+  }
+}
diff --git a/src/lib/chrome-ai/services/PromptService.ts b/src/lib/chrome-ai/services/PromptService.ts
index 5dd1f6e..1ed4db7 100644
--- a/src/lib/chrome-ai/services/PromptService.ts
+++ b/src/lib/chrome-ai/services/PromptService.ts
@@ -152,7 +152,7 @@ export class PromptService {
   /**
    * Initialize the Prompt service and create a session
    */
-  async initialize(): Promise<void> {
+  async initialize(overrideOptions?: AILanguageModelCreateOptions): Promise<void> {
     if (this.session) {
       return
     }
@@ -164,6 +164,7 @@ export class PromptService {
         topK: this.sessionConfig.topK,
         expectedInputs: this.sessionConfig.expectedInputs,
         expectedOutputs: this.sessionConfig.expectedOutputs,
+        ...overrideOptions,
       }
 
       // Add monitor if provided
diff --git a/src/lib/chrome-ai/services/ProofreaderService.ts b/src/lib/chrome-ai/services/ProofreaderService.ts
new file mode 100644
index 0000000..30d42ec
--- /dev/null
+++ b/src/lib/chrome-ai/services/ProofreaderService.ts
@@ -0,0 +1,381 @@
+import { reportError } from '@/lib/errors/report-error'
+import { ProofreaderError, isProofreaderError } from '../errors'
+import { createProofreader, destroyProofreader, proofreadText } from '../proofreader'
+import { validateTextInput } from '../utils/validator'
+import { chunkText, reassembleChunks, needsChunking, type TextChunk } from '../utils/contentChunker'
+import { withRetry, type RetryOptions } from '../utils/retryHandler'
+import { CONTENT_LIMITS } from '../constants'
+import type {
+  AIProofreader,
+  AIProofreaderCreateOptions,
+  ProofreadResult,
+  Correction,
+  AIModelDownloadProgress,
+} from '../types'
+
+export interface ProofreaderServiceConfig {
+  /**
+   * Enable automatic retry on failures
+   * @default true
+   */
+  enableRetry?: boolean
+
+  /**
+   * Retry configuration
+   */
+  retryOptions?: RetryOptions
+
+  /**
+   * Enable automatic chunking for long content
+   * @default true
+   */
+  enableChunking?: boolean
+
+  /**
+   * Enable input validation and sanitization
+   * @default true
+   */
+  enableValidation?: boolean
+
+  /**
+   * Expected input languages (BCP 47 codes)
+   * @default ['en']
+   */
+  expectedLanguages?: string[]
+
+  /**
+   * Monitor download progress when model needs to be downloaded
+   * Callback receives download progress updates
+   */
+  monitor?: (progress: AIModelDownloadProgress) => void
+}
+
+export interface ProofreadOptions {
+  /**
+   * Abort signal
+   */
+  signal?: AbortSignal
+
+  /**
+   * Progress callback for chunked processing
+   */
+  onProgress?: (current: number, total: number) => void
+}
+
+export interface EnhancedProofreadResult extends ProofreadResult {
+  /**
+   * Statistics about the corrections
+   */
+  stats: {
+    totalCorrections: number
+    grammarErrors: number
+    spellingErrors: number
+    punctuationErrors: number
+    styleIssues: number
+  }
+}
+
+export interface CorrectionsByType {
+  grammar: Correction[]
+  spelling: Correction[]
+  punctuation: Correction[]
+  style: Correction[]
+}
+
+/**
+ * ProofreaderService - Main business logic class for text proofreading
+ *
+ * This service provides high-level proofreading with:
+ * - Automatic validation and sanitization
+ * - Content chunking for long text
+ * - Retry logic for reliability
+ * - Correction statistics and categorization
+ * - Multiple output formats (corrections only, corrected text, full results)
+ *
+ * @example
+ * ```typescript
+ * const proofreaderService = new ProofreaderService({
+ *   expectedLanguages: ['en'],
+ *   enableRetry: true,
+ * })
+ *
+ * await proofreaderService.initialize()
+ *
+ * // Proofread text with full results
+ * const result = await proofreaderService.proofread('Text with erors')
+ * console.log(result.stats.totalCorrections) // 1
+ * console.log(result.corrected) // 'Text with errors'
+ *
+ * // Get only corrections
+ * const corrections = await proofreaderService.getCorrectionsOnly('Text with erors')
+ *
+ * // Get corrections grouped by type
+ * const byType = proofreaderService.groupCorrectionsByType(corrections)
+ * ```
+ */
+export class ProofreaderService {
+  private config: Required<Omit<ProofreaderServiceConfig, 'monitor' | 'expectedLanguages'>> & {
+    monitor?: (progress: AIModelDownloadProgress) => void
+    expectedLanguages?: string[]
+  }
+
+  private proofreader: AIProofreader | null = null
+  private isInitialized = false
+
+  constructor(config: ProofreaderServiceConfig = {}) {
+    this.config = {
+      enableRetry: config.enableRetry ?? true,
+      retryOptions: config.retryOptions ?? {},
+      enableChunking: config.enableChunking ?? true,
+      enableValidation: config.enableValidation ?? true,
+      monitor: config.monitor,
+      expectedLanguages: config.expectedLanguages,
+    }
+  }
+
+  /**
+   * Initialize the Proofreader API
+   * Must be called before using any proofread methods
+   */
+  async initialize(options?: AIProofreaderCreateOptions): Promise<void> {
+    if (this.isInitialized) {
+      return
+    }
+
+    try {
+      const createOptions: AIProofreaderCreateOptions = {
+        expectedInputLanguages: options?.expectedInputLanguages || this.config.expectedLanguages || ['en'],
+        ...options,
+      }
+
+      if (options?.monitor || this.config.monitor) {
+        createOptions.monitor = options?.monitor || this.config.monitor
+      }
+
+      if (this.config.enableRetry) {
+        this.proofreader = await withRetry(
+          () => createProofreader(createOptions),
+          this.config.retryOptions
+        )
+      } else {
+        this.proofreader = await createProofreader(createOptions)
+      }
+
+      this.isInitialized = true
+    } catch (error) {
+      const proofreaderError = isProofreaderError(error)
+        ? error
+        : new ProofreaderError('Failed to initialize ProofreaderService', 'INITIALIZATION_FAILED', error)
+
+      reportError({
+        error: proofreaderError,
+        context: { operation: 'ProofreaderService.initialize', options },
+        severity: 'error',
+        source: 'chrome-ai:proofreader-service',
+      })
+
+      throw proofreaderError
+    }
+  }
+
+  /**
+   * Proofread text and return enhanced results with statistics
+   * @param text - The text to proofread
+   * @param options - Options for this proofread operation
+   * @returns Enhanced proofread result with corrections and statistics
+   */
+  async proofread(text: string, options?: ProofreadOptions): Promise<EnhancedProofreadResult> {
+    this.ensureInitialized()
+
+    try {
+      // Validate and sanitize input
+      if (this.config.enableValidation) {
+        const validation = validateTextInput(text)
+        if (!validation.valid) {
+          throw validation.error!
+        }
+        // Note: We don't sanitize for proofreading as we need to preserve original text
+      }
+
+      // Check if chunking is needed
+      if (this.config.enableChunking && needsChunking(text, CONTENT_LIMITS.maxCharacters)) {
+        return this.proofreadChunked(text, options)
+      }
+
+      // Single proofread operation
+      let result: ProofreadResult
+      if (this.config.enableRetry) {
+        result = await withRetry(
+          () => proofreadText(this.proofreader!, text),
+          this.config.retryOptions
+        )
+      } else {
+        result = await proofreadText(this.proofreader!, text)
+      }
+
+      // Calculate statistics
+      const stats = this.calculateStats(result.corrections)
+
+      return {
+        ...result,
+        stats,
+      }
+    } catch (error) {
+      this.handleError('proofread', error, { textLength: text.length })
+      throw error
+    }
+  }
+
+  /**
+   * Get only the corrections array without the corrected text
+   * @param text - The text to proofread
+   * @param options - Options for this proofread operation
+   * @returns Array of corrections
+   */
+  async getCorrectionsOnly(text: string, options?: ProofreadOptions): Promise<Correction[]> {
+    const result = await this.proofread(text, options)
+    return result.corrections
+  }
+
+  /**
+   * Get only the corrected text without correction details
+   * @param text - The text to proofread
+   * @param options - Options for this proofread operation
+   * @returns The corrected text
+   */
+  async getCorrectedText(text: string, options?: ProofreadOptions): Promise<string> {
+    const result = await this.proofread(text, options)
+    return result.corrected
+  }
+
+  /**
+   * Group corrections by error type
+   * @param corrections - Array of corrections to group
+   * @returns Corrections organized by type
+   */
+  groupCorrectionsByType(corrections: Correction[]): CorrectionsByType {
+    return {
+      grammar: corrections.filter(c => c.errorType === 'grammar'),
+      spelling: corrections.filter(c => c.errorType === 'spelling'),
+      punctuation: corrections.filter(c => c.errorType === 'punctuation'),
+      style: corrections.filter(c => c.errorType === 'style'),
+    }
+  }
+
+  /**
+   * Process long text in chunks
+   * @private
+   */
+  private async proofreadChunked(text: string, options?: ProofreadOptions): Promise<EnhancedProofreadResult> {
+    const chunks = chunkText(text, { maxChunkSize: CONTENT_LIMITS.chunkSize })
+    const allCorrections: Correction[] = []
+    const correctedChunks: TextChunk[] = []
+    let cumulativeOffset = 0
+
+    for (let i = 0; i < chunks.length; i++) {
+      const chunk = chunks[i]
+
+      // Report progress
+      if (options?.onProgress) {
+        options.onProgress(i + 1, chunks.length)
+      }
+
+      let result: ProofreadResult
+      if (this.config.enableRetry) {
+        result = await withRetry(
+          () => proofreadText(this.proofreader!, chunk.text),
+          this.config.retryOptions
+        )
+      } else {
+        result = await proofreadText(this.proofreader!, chunk.text)
+      }
+
+      // Adjust correction indices to account for chunk position in original text
+      const adjustedCorrections = result.corrections.map(correction => ({
+        ...correction,
+        startIndex: correction.startIndex + cumulativeOffset,
+        endIndex: correction.endIndex + cumulativeOffset,
+      }))
+
+      allCorrections.push(...adjustedCorrections)
+
+      correctedChunks.push({
+        ...chunk,
+        text: result.corrected,
+      })
+
+      cumulativeOffset += chunk.text.length
+    }
+
+    const correctedText = reassembleChunks(correctedChunks)
+    const stats = this.calculateStats(allCorrections)
+
+    return {
+      corrected: correctedText,
+      corrections: allCorrections,
+      stats,
+    }
+  }
+
+  /**
+   * Calculate statistics from corrections
+   * @private
+   */
+  private calculateStats(corrections: Correction[]) {
+    return {
+      totalCorrections: corrections.length,
+      grammarErrors: corrections.filter(c => c.errorType === 'grammar').length,
+      spellingErrors: corrections.filter(c => c.errorType === 'spelling').length,
+      punctuationErrors: corrections.filter(c => c.errorType === 'punctuation').length,
+      styleIssues: corrections.filter(c => c.errorType === 'style').length,
+    }
+  }
+
+  /**
+   * Destroy the proofreader instance and free resources
+   */
+  destroy(): void {
+    if (this.proofreader) {
+      destroyProofreader(this.proofreader)
+      this.proofreader = null
+    }
+    this.isInitialized = false
+  }
+
+  /**
+   * Check if the service is initialized
+   */
+  get initialized(): boolean {
+    return this.isInitialized
+  }
+
+  /**
+   * Ensure the service is initialized before operations
+   * @private
+   */
+  private ensureInitialized(): void {
+    if (!this.isInitialized || !this.proofreader) {
+      throw new ProofreaderError(
+        'ProofreaderService not initialized. Call initialize() first.',
+        'NOT_AVAILABLE'
+      )
+    }
+  }
+
+  /**
+   * Handle errors with proper logging and reporting
+   * @private
+   */
+  private handleError(operation: string, error: unknown, context: Record<string, unknown>): void {
+    const proofreaderError = isProofreaderError(error)
+      ? error
+      : new ProofreaderError(`Operation failed: ${operation}`, 'UNKNOWN_ERROR', error)
+
+    reportError({
+      error: proofreaderError,
+      context: { operation: `ProofreaderService.${operation}`, ...context },
+      severity: 'error',
+      source: 'chrome-ai:proofreader-service',
+    })
+  }
+}
diff --git a/src/lib/chrome-ai/services/WriterService.ts b/src/lib/chrome-ai/services/WriterService.ts
new file mode 100644
index 0000000..d1d3972
--- /dev/null
+++ b/src/lib/chrome-ai/services/WriterService.ts
@@ -0,0 +1,427 @@
+import { reportError } from '@/lib/errors/report-error'
+import { WriterError, isWriterError } from '../errors'
+import { createWriter, destroyWriter, writeText, writeTextStreaming } from '../writer'
+import { validateTextInput, validateContext } from '../utils/validator'
+import { sanitizeText, escapeContext } from '../utils/sanitizer'
+import { chunkText, reassembleChunks, needsChunking, type TextChunk } from '../utils/contentChunker'
+import { withRetry, type RetryOptions } from '../utils/retryHandler'
+import { CONTENT_LIMITS } from '../constants'
+import type {
+  AIWriter,
+  AIWriterCreateOptions,
+  AIModelDownloadProgress,
+  AIWriterTone,
+  AIWriterLength,
+} from '../types'
+
+export interface WriterServiceConfig {
+  /**
+   * Enable automatic retry on failures
+   * @default true
+   */
+  enableRetry?: boolean
+
+  /**
+   * Retry configuration
+   */
+  retryOptions?: RetryOptions
+
+  /**
+   * Enable automatic chunking for long content
+   * @default true
+   */
+  enableChunking?: boolean
+
+  /**
+   * Enable input validation and sanitization
+   * @default true
+   */
+  enableValidation?: boolean
+
+  /**
+   * The tone for generated text
+   * @default 'neutral'
+   */
+  tone?: AIWriterTone
+
+  /**
+   * The format of generated text
+   * @default 'plain-text'
+   */
+  format?: 'markdown' | 'plain-text'
+
+  /**
+   * Target length for generated text
+   * @default 'medium'
+   */
+  length?: AIWriterLength
+
+  /**
+   * Shared context for all writing operations
+   */
+  sharedContext?: string
+
+  /**
+   * Monitor download progress when model needs to be downloaded
+   * Callback receives download progress updates
+   */
+  monitor?: (progress: AIModelDownloadProgress) => void
+}
+
+export interface WriteOptions {
+  /**
+   * Additional context specific to this writing operation
+   */
+  context?: string
+
+  /**
+   * Abort signal
+   */
+  signal?: AbortSignal
+
+  /**
+   * Progress callback for chunked processing
+   */
+  onProgress?: (current: number, total: number) => void
+}
+
+export interface ExpandTextOptions extends WriteOptions {
+  /**
+   * Target length for expansion
+   */
+  targetLength?: AIWriterLength
+}
+
+export interface AdjustToneOptions extends WriteOptions {
+  /**
+   * Target tone for the text
+   */
+  targetTone: AIWriterTone
+}
+
+/**
+ * WriterService - Main business logic class for text generation
+ *
+ * This service provides high-level text generation with:
+ * - Automatic validation and sanitization
+ * - Content chunking for long text
+ * - Retry logic for reliability
+ * - Tone adjustment capabilities
+ * - Text expansion features
+ *
+ * @example
+ * ```typescript
+ * const writerService = new WriterService({
+ *   tone: 'neutral',
+ *   length: 'medium',
+ *   enableRetry: true,
+ * })
+ *
+ * await writerService.initialize()
+ *
+ * // Generate text
+ * const result = await writerService.write('Brief outline for blog post')
+ *
+ * // Expand text
+ * const expanded = await writerService.expandText('Short intro', {
+ *   targetLength: 'long'
+ * })
+ *
+ * // Adjust tone
+ * const formal = await writerService.adjustTone('casual text here', {
+ *   targetTone: 'formal'
+ * })
+ * ```
+ */
+export class WriterService {
+  private config: Required<Omit<WriterServiceConfig, 'monitor' | 'sharedContext'>> & {
+    monitor?: (progress: AIModelDownloadProgress) => void
+    sharedContext?: string
+  }
+
+  private writer: AIWriter | null = null
+  private isInitialized = false
+
+  constructor(config: WriterServiceConfig = {}) {
+    this.config = {
+      enableRetry: config.enableRetry ?? true,
+      retryOptions: config.retryOptions ?? {},
+      enableChunking: config.enableChunking ?? true,
+      enableValidation: config.enableValidation ?? true,
+      tone: config.tone ?? 'neutral',
+      format: config.format ?? 'plain-text',
+      length: config.length ?? 'medium',
+      monitor: config.monitor,
+      sharedContext: config.sharedContext,
+    }
+  }
+
+  /**
+   * Initialize the Writer API
+   * Must be called before using any write methods
+   */
+  async initialize(options?: AIWriterCreateOptions): Promise<void> {
+    if (this.isInitialized) {
+      return
+    }
+
+    try {
+      const createOptions: AIWriterCreateOptions = {
+        tone: options?.tone || this.config.tone,
+        format: options?.format || this.config.format,
+        length: options?.length || this.config.length,
+        sharedContext: options?.sharedContext || this.config.sharedContext,
+        ...options,
+      }
+
+      if (options?.monitor || this.config.monitor) {
+        createOptions.monitor = options?.monitor || this.config.monitor
+      }
+
+      if (this.config.enableRetry) {
+        this.writer = await withRetry(
+          () => createWriter(createOptions),
+          this.config.retryOptions
+        )
+      } else {
+        this.writer = await createWriter(createOptions)
+      }
+
+      this.isInitialized = true
+    } catch (error) {
+      const writerError = isWriterError(error)
+        ? error
+        : new WriterError('Failed to initialize WriterService', 'INITIALIZATION_FAILED', error)
+
+      reportError({
+        error: writerError,
+        context: { operation: 'WriterService.initialize', options },
+        severity: 'error',
+        source: 'chrome-ai:writer-service',
+      })
+
+      throw writerError
+    }
+  }
+
+  /**
+   * Generate text from a prompt
+   * @param prompt - The input prompt or text to generate from
+   * @param options - Options for this write operation
+   * @returns Generated text
+   */
+  async write(prompt: string, options?: WriteOptions): Promise<string> {
+    this.ensureInitialized()
+
+    try {
+      // Validate and sanitize input
+      if (this.config.enableValidation) {
+        const validation = validateTextInput(prompt)
+        if (!validation.valid) {
+          throw validation.error!
+        }
+        prompt = sanitizeText(prompt)
+
+        if (options?.context) {
+          const contextValidation = validateContext(options.context)
+          if (!contextValidation.valid) {
+            throw contextValidation.error!
+          }
+          options.context = escapeContext(options.context)
+        }
+      }
+
+      // Check if chunking is needed
+      if (this.config.enableChunking && needsChunking(prompt, CONTENT_LIMITS.maxCharacters)) {
+        return this.writeChunked(prompt, options)
+      }
+
+      // Single write operation
+      if (this.config.enableRetry) {
+        return await withRetry(
+          () => writeText(this.writer!, prompt, options),
+          this.config.retryOptions
+        )
+      }
+
+      return await writeText(this.writer!, prompt, options)
+    } catch (error) {
+      this.handleError('write', error, { promptLength: prompt.length, options })
+      throw error
+    }
+  }
+
+  /**
+   * Generate text with streaming output
+   * @param prompt - The input prompt or text to generate from
+   * @param onChunk - Callback for each chunk of generated text
+   * @param options - Options for this write operation
+   */
+  async writeStream(
+    prompt: string,
+    onChunk: (chunk: string) => void,
+    options?: WriteOptions
+  ): Promise<void> {
+    this.ensureInitialized()
+
+    try {
+      // Validate and sanitize input
+      if (this.config.enableValidation) {
+        const validation = validateTextInput(prompt)
+        if (!validation.valid) {
+          throw validation.error!
+        }
+        prompt = sanitizeText(prompt)
+
+        if (options?.context) {
+          const contextValidation = validateContext(options.context)
+          if (!contextValidation.valid) {
+            throw contextValidation.error!
+          }
+          options.context = escapeContext(options.context)
+        }
+      }
+
+      const stream = writeTextStreaming(this.writer!, prompt, options)
+
+      for await (const chunk of stream) {
+        onChunk(chunk)
+      }
+    } catch (error) {
+      this.handleError('writeStream', error, { promptLength: prompt.length, options })
+      throw error
+    }
+  }
+
+  /**
+   * Expand brief text into more detailed version
+   * @param briefText - The brief text to expand
+   * @param options - Options for text expansion
+   * @returns Expanded text
+   */
+  async expandText(briefText: string, options?: ExpandTextOptions): Promise<string> {
+    const lengthDescriptions = {
+      short: 'concise but more detailed',
+      medium: 'moderately detailed',
+      long: 'comprehensive and detailed',
+    }
+
+    const targetLength = options?.targetLength || 'medium'
+    const lengthDesc = lengthDescriptions[targetLength]
+
+    const prompt = `Expand the following brief text into a ${lengthDesc} version while maintaining the core message and meaning:\n\n${briefText}`
+
+    return this.write(prompt, {
+      context: options?.context,
+      signal: options?.signal,
+      onProgress: options?.onProgress,
+    })
+  }
+
+  /**
+   * Adjust the tone of text while preserving meaning
+   * @param text - The text to adjust
+   * @param options - Options including target tone
+   * @returns Text with adjusted tone
+   */
+  async adjustTone(text: string, options: AdjustToneOptions): Promise<string> {
+    const toneDescriptions = {
+      formal: 'professional and formal',
+      neutral: 'balanced and neutral',
+      casual: 'friendly and conversational',
+    }
+
+    const toneDesc = toneDescriptions[options.targetTone]
+
+    const prompt = `Rewrite the following text in a ${toneDesc} tone while preserving the exact meaning and key information:\n\n${text}`
+
+    return this.write(prompt, {
+      context: options?.context,
+      signal: options?.signal,
+      onProgress: options?.onProgress,
+    })
+  }
+
+  /**
+   * Process long text in chunks
+   * @private
+   */
+  private async writeChunked(prompt: string, options?: WriteOptions): Promise<string> {
+    const chunks = chunkText(prompt, { maxChunkSize: CONTENT_LIMITS.chunkSize })
+    const results: TextChunk[] = []
+
+    for (let i = 0; i < chunks.length; i++) {
+      const chunk = chunks[i]
+
+      // Report progress
+      if (options?.onProgress) {
+        options.onProgress(i + 1, chunks.length)
+      }
+
+      let result: string
+      if (this.config.enableRetry) {
+        result = await withRetry(
+          () => writeText(this.writer!, chunk.text, options),
+          this.config.retryOptions
+        )
+      } else {
+        result = await writeText(this.writer!, chunk.text, options)
+      }
+
+      results.push({
+        ...chunk,
+        text: result,
+      })
+    }
+
+    return reassembleChunks(results)
+  }
+
+  /**
+   * Destroy the writer instance and free resources
+   */
+  destroy(): void {
+    if (this.writer) {
+      destroyWriter(this.writer)
+      this.writer = null
+    }
+    this.isInitialized = false
+  }
+
+  /**
+   * Check if the service is initialized
+   */
+  get initialized(): boolean {
+    return this.isInitialized
+  }
+
+  /**
+   * Ensure the service is initialized before operations
+   * @private
+   */
+  private ensureInitialized(): void {
+    if (!this.isInitialized || !this.writer) {
+      throw new WriterError(
+        'WriterService not initialized. Call initialize() first.',
+        'NOT_AVAILABLE'
+      )
+    }
+  }
+
+  /**
+   * Handle errors with proper logging and reporting
+   * @private
+   */
+  private handleError(operation: string, error: unknown, context: Record<string, unknown>): void {
+    const writerError = isWriterError(error)
+      ? error
+      : new WriterError(`Operation failed: ${operation}`, 'UNKNOWN_ERROR', error)
+
+    reportError({
+      error: writerError,
+      context: { operation: `WriterService.${operation}`, ...context },
+      severity: 'error',
+      source: 'chrome-ai:writer-service',
+    })
+  }
+}
diff --git a/src/lib/chrome-ai/services/WritingEnhancementService.ts b/src/lib/chrome-ai/services/WritingEnhancementService.ts
new file mode 100644
index 0000000..99ad085
--- /dev/null
+++ b/src/lib/chrome-ai/services/WritingEnhancementService.ts
@@ -0,0 +1,824 @@
+import { PromptService } from './PromptService'
+import { WriterService } from './WriterService'
+import { ProofreaderService } from './ProofreaderService'
+import { RewriterService } from './RewriterService'
+import type { EnhancedProofreadResult } from './ProofreaderService'
+import type { AIWriterTone } from '../types'
+
+export interface WritingSuggestion {
+  /**
+   * Category of the suggestion
+   */
+  category: 'structure' | 'clarity' | 'engagement' | 'conciseness' | 'tone'
+
+  /**
+   * Description of the issue
+   */
+  issue: string
+
+  /**
+   * Suggested improvement
+   */
+  suggestion: string
+
+  /**
+   * Optional example of the improvement
+   */
+  example?: string
+
+  /**
+   * Priority level
+   */
+  priority: 'high' | 'medium' | 'low'
+}
+
+export interface KeyPoint {
+  /**
+   * The key point or main idea
+   */
+  point: string
+
+  /**
+   * Importance level
+   */
+  importance: 'primary' | 'secondary' | 'supporting'
+}
+
+/**
+ * Expected JSON structure for key points from AI
+ * @private
+ */
+interface KeyPointsResponse {
+  keyPoints: Array<{
+    point: string
+    importance: 'primary' | 'secondary' | 'supporting'
+  }>
+}
+
+/**
+ * Expected JSON structure for suggestions from AI
+ * @private
+ */
+interface SuggestionsResponse {
+  suggestions: WritingSuggestion[]
+}
+
+/**
+ * Telemetry data for debugging and monitoring
+ * @private
+ */
+interface EnhancementTelemetry {
+  operation: string
+  inputLength: number
+  outputLength?: number
+  duration: number
+  success: boolean
+  error?: string
+  qualityScore?: number
+  usedFallback: boolean
+}
+
+export interface WritingEnhancementResult {
+  /**
+   * Original input text
+   */
+  original: string
+
+  /**
+   * Corrected text (if grammar correction was requested)
+   */
+  corrected?: string
+
+  /**
+   * Grammar and spelling corrections (if requested)
+   */
+  corrections?: EnhancedProofreadResult
+
+  /**
+   * Extracted key points (if requested)
+   */
+  keyPoints?: KeyPoint[]
+
+  /**
+   * Writing improvement suggestions (if requested)
+   */
+  suggestions?: WritingSuggestion[]
+
+  /**
+   * Text with adjusted tone (if requested)
+   */
+  toneAdjusted?: string
+
+  /**
+   * Expanded version of text (if requested)
+   */
+  expanded?: string
+}
+
+export interface EnhanceOptions {
+  /**
+   * Correct grammar and spelling
+   */
+  correctGrammar?: boolean
+
+  /**
+   * Extract key points for summaries
+   */
+  extractKeyPoints?: boolean
+
+  /**
+   * Get actionable writing suggestions
+   */
+  getSuggestions?: boolean
+
+  /**
+   * Adjust tone of text
+   */
+  adjustTone?: 'professional' | 'casual' | 'academic' | 'simple'
+
+  /**
+   * Expand brief text into more detailed version
+   */
+  expand?: boolean
+
+  /**
+   * Abort signal
+   */
+  signal?: AbortSignal
+}
+
+/**
+ * WritingEnhancementService - Orchestrates all writing assistance features
+ *
+ * This service combines multiple Chrome AI APIs to provide comprehensive
+ * writing assistance including:
+ * - Grammar and spelling correction (Proofreader API)
+ * - Tone adjustment (Writer + Rewriter APIs)
+ * - Key point extraction (Prompt API)
+ * - Text expansion (Writer API)
+ * - Writing improvement suggestions (Prompt API)
+ *
+ * @example
+ * ```typescript
+ * const service = new WritingEnhancementService()
+ * await service.initialize()
+ *
+ * // Get grammar corrections
+ * const result = await service.correctGrammar('Text with erors')
+ *
+ * // Adjust tone
+ * const formal = await service.adjustTone('hey there!', 'professional')
+ *
+ * // Extract key points
+ * const points = await service.extractKeyPoints('Long article text...')
+ *
+ * // Expand text
+ * const expanded = await service.expandText('Brief intro')
+ *
+ * // Get writing suggestions
+ * const suggestions = await service.getWritingSuggestions('Text to improve')
+ *
+ * // Or do multiple enhancements at once
+ * const enhanced = await service.enhanceText('Text to enhance', {
+ *   correctGrammar: true,
+ *   extractKeyPoints: true,
+ *   getSuggestions: true
+ * })
+ * ```
+ */
+export class WritingEnhancementService {
+  private promptService: PromptService
+  private writerService: WriterService
+  private proofreaderService: ProofreaderService
+  private rewriterService: RewriterService
+
+  constructor() {
+    this.promptService = new PromptService({ enableRetry: true })
+    this.writerService = new WriterService({ enableRetry: true })
+    this.proofreaderService = new ProofreaderService({ enableRetry: true })
+    this.rewriterService = new RewriterService({ enableRetry: true })
+  }
+
+  /**
+   * Initialize all underlying services
+   */
+  async initialize(): Promise<void> {
+    // Initialize services, handling failures gracefully
+    const results = await Promise.allSettled([
+      this.promptService.initialize(),
+      this.writerService.initialize({
+        outputLanguage: 'en',
+      }),
+      this.proofreaderService.initialize({
+        expectedInputLanguages: ['en'],
+      }),
+      this.rewriterService.initialize(),
+    ])
+
+    // Log which services failed to initialize
+    const serviceNames = ['PromptService', 'WriterService', 'ProofreaderService', 'RewriterService']
+    results.forEach((result, index) => {
+      if (result.status === 'rejected') {
+        console.warn(`${serviceNames[index]} failed to initialize:`, result.reason)
+      }
+    })
+
+    // Check if at least PromptService and RewriterService are available
+    if (results[0].status === 'rejected' || results[3].status === 'rejected') {
+      throw new Error('Critical services (Prompt or Rewriter) failed to initialize. Writing enhancement requires these APIs.')
+    }
+  }
+
+  /**
+   * Correct grammar and spelling errors in text
+   * @param text - Text to proofread
+   * @returns Enhanced proofread result with corrections and statistics
+   */
+  async correctGrammar(text: string): Promise<EnhancedProofreadResult> {
+    if (!this.proofreaderService.initialized) {
+      throw new Error(
+        'Proofreader API is not available. Please ensure you are using Chrome 137+ ' +
+        'with the Writer API flag enabled. Visit chrome://flags/#writer-api for setup instructions. ' +
+        'See docs/SETUP.md for detailed setup guide.'
+      )
+    }
+    return this.proofreaderService.proofread(text)
+  }
+
+  /**
+   * Adjust the tone of text while preserving meaning
+   * @param text - Text to adjust
+   * @param targetTone - Target tone for the text
+   * @returns Text with adjusted tone
+   */
+  async adjustTone(
+    text: string,
+    targetTone: 'professional' | 'casual' | 'academic' | 'simple'
+  ): Promise<string> {
+    const toneMap: Record<string, AIWriterTone> = {
+      professional: 'formal',
+      casual: 'casual',
+      academic: 'formal',
+      simple: 'neutral',
+    }
+
+    // Use Rewriter API for simplification (simple tone)
+    if (targetTone === 'simple') {
+      if (!this.rewriterService.initialized) {
+        throw new Error(
+          'Rewriter API is not available. Please ensure you are using Chrome 137+ ' +
+          'with the Rewriter API flag enabled. Visit chrome://flags/#rewriter-api for setup instructions. ' +
+          'See docs/SETUP.md for detailed setup guide.'
+        )
+      }
+      return this.rewriterService.simplify(text, {
+        readingLevel: 'middle-school',
+        autoDetectTechnicalTerms: true,
+      })
+    }
+
+    // Use Writer API for other tone adjustments
+    if (!this.writerService.initialized) {
+      throw new Error(
+        'Writer API is not available. Please ensure you are using Chrome 137+ ' +
+        'with the Writer API flag enabled. Visit chrome://flags/#writer-api for setup instructions. ' +
+        'See docs/SETUP.md for detailed setup guide.'
+      )
+    }
+    return this.writerService.adjustTone(text, {
+      targetTone: toneMap[targetTone],
+    })
+  }
+
+  /**
+   * Extract key points from text for summaries
+   * @param text - Text to analyze
+   * @returns Array of key points with importance levels
+   */
+  async extractKeyPoints(text: string): Promise<KeyPoint[]> {
+    const startTime = Date.now()
+    let usedFallback = false
+
+    const prompt = `Analyze the following text and extract 3-5 key points. Return your response as JSON with this exact structure:
+
+{
+  "keyPoints": [
+    { "point": "First main idea", "importance": "primary" },
+    { "point": "Second important idea", "importance": "secondary" },
+    { "point": "Supporting detail", "importance": "supporting" }
+  ]
+}
+
+Rules:
+- Use "primary" for the most critical point (1-2 points)
+- Use "secondary" for important but not critical points (2-3 points)
+- Use "supporting" for additional context (0-2 points)
+- Each point should be a concise sentence or phrase
+- Return ONLY the JSON, no other text
+
+Text to analyze:
+${text}`
+
+    try {
+      const response = await this.promptService.prompt(prompt)
+      console.log('Key points response:', response)
+
+      // Try parsing as JSON first
+      const validated = this.parseAndValidateKeyPoints(response)
+      if (validated) {
+        const qualityScore = this.scoreKeyPointsQuality(validated)
+        console.log(`Key points quality score: ${qualityScore}/100`)
+        if (qualityScore < 50) {
+          console.warn('Low quality key points detected')
+        }
+
+        // Validate output length
+        const totalLength = validated.reduce((sum, kp) => sum + kp.point.length, 0)
+        this.validateOutputLength('extractKeyPoints', text.length, totalLength)
+
+        // Log telemetry
+        this.logTelemetry({
+          operation: 'extractKeyPoints',
+          inputLength: text.length,
+          outputLength: validated.length,
+          duration: Date.now() - startTime,
+          success: true,
+          qualityScore,
+          usedFallback: false,
+        })
+
+        return validated
+      }
+
+      // Fallback: parse as text if JSON fails
+      console.warn('JSON parsing failed, falling back to text parsing')
+      usedFallback = true
+      const fallbackResult = this.parseKeyPointsFromText(response)
+
+      const qualityScore = this.scoreKeyPointsQuality(fallbackResult)
+      this.logTelemetry({
+        operation: 'extractKeyPoints',
+        inputLength: text.length,
+        outputLength: fallbackResult.length,
+        duration: Date.now() - startTime,
+        success: true,
+        qualityScore,
+        usedFallback: true,
+      })
+
+      return fallbackResult
+    } catch (error) {
+      console.error('extractKeyPoints error:', error)
+
+      this.logTelemetry({
+        operation: 'extractKeyPoints',
+        inputLength: text.length,
+        duration: Date.now() - startTime,
+        success: false,
+        error: error instanceof Error ? error.message : String(error),
+        usedFallback,
+      })
+
+      throw new Error(
+        'Failed to extract key points. Please ensure the Prompt API is available ' +
+        '(Chrome 137+ with chrome://flags/#prompt-api-for-gemini-nano enabled). ' +
+        'See docs/SETUP.md for detailed setup guide.'
+      )
+    }
+  }
+
+  /**
+   * Expand brief text into a more detailed version
+   * @param briefText - Brief text to expand
+   * @param targetLength - Target length (short, medium, long)
+   * @returns Expanded text
+   */
+  async expandText(
+    briefText: string,
+    targetLength: 'short' | 'medium' | 'long' = 'medium'
+  ): Promise<string> {
+    if (!this.writerService.initialized) {
+      throw new Error(
+        'Writer API is not available for text expansion. Please ensure you are using Chrome 137+ ' +
+        'with the Writer API flag enabled. Visit chrome://flags/#writer-api for setup instructions. ' +
+        'See docs/SETUP.md for detailed setup guide.'
+      )
+    }
+    return this.writerService.expandText(briefText, { targetLength })
+  }
+
+  /**
+   * Get actionable writing improvement suggestions
+   * @param text - Text to analyze
+   * @returns Array of categorized writing suggestions
+   */
+  async getWritingSuggestions(text: string): Promise<WritingSuggestion[]> {
+    const startTime = Date.now()
+    let usedFallback = false
+
+    const prompt = `Analyze the following text and provide 2-4 actionable writing improvement suggestions. Return your response as JSON with this exact structure:
+
+{
+  "suggestions": [
+    {
+      "category": "clarity",
+      "issue": "Specific problem identified",
+      "suggestion": "How to improve it",
+      "example": "Optional example of the improvement",
+      "priority": "high"
+    }
+  ]
+}
+
+Categories: "structure", "clarity", "engagement", "conciseness", "tone"
+Priority: "high", "medium", "low"
+
+Rules:
+- Focus on actionable, specific improvements
+- Provide concrete examples when possible
+- Prioritize high-impact changes
+- Return ONLY the JSON, no other text
+
+Text to analyze:
+${text}`
+
+    try {
+      const response = await this.promptService.prompt(prompt)
+      console.log('Suggestions response:', response)
+
+      // Try parsing as JSON first
+      const validated = this.parseAndValidateSuggestions(response)
+      if (validated) {
+        const qualityScore = this.scoreSuggestionsQuality(validated)
+        console.log(`Suggestions quality score: ${qualityScore}/100`)
+        if (qualityScore < 50) {
+          console.warn('Low quality suggestions detected')
+        }
+
+        // Log telemetry
+        this.logTelemetry({
+          operation: 'getWritingSuggestions',
+          inputLength: text.length,
+          outputLength: validated.length,
+          duration: Date.now() - startTime,
+          success: true,
+          qualityScore,
+          usedFallback: false,
+        })
+
+        return validated
+      }
+
+      // Fallback: parse as text if JSON fails
+      console.warn('JSON parsing failed, falling back to text parsing')
+      usedFallback = true
+      const fallbackResult = this.parseSuggestionsFromText(response)
+
+      const qualityScore = this.scoreSuggestionsQuality(fallbackResult)
+      this.logTelemetry({
+        operation: 'getWritingSuggestions',
+        inputLength: text.length,
+        outputLength: fallbackResult.length,
+        duration: Date.now() - startTime,
+        success: true,
+        qualityScore,
+        usedFallback: true,
+      })
+
+      return fallbackResult
+    } catch (error) {
+      console.error('getWritingSuggestions error:', error)
+
+      this.logTelemetry({
+        operation: 'getWritingSuggestions',
+        inputLength: text.length,
+        duration: Date.now() - startTime,
+        success: false,
+        error: error instanceof Error ? error.message : String(error),
+        usedFallback,
+      })
+
+      throw new Error(
+        'Failed to get writing suggestions. Please ensure the Prompt API is available ' +
+        '(Chrome 137+ with chrome://flags/#prompt-api-for-gemini-nano enabled). ' +
+        'See docs/SETUP.md for detailed setup guide.'
+      )
+    }
+  }
+
+  /**
+   * Perform multiple enhancements on text in parallel
+   * @param text - Text to enhance
+   * @param options - Which enhancements to perform
+   * @returns Comprehensive enhancement results
+   */
+  async enhanceText(text: string, options: EnhanceOptions): Promise<WritingEnhancementResult> {
+    const result: WritingEnhancementResult = {
+      original: text,
+    }
+
+    const tasks: Promise<void>[] = []
+
+    // Run all requested enhancements in parallel for better performance
+    // Use Promise.allSettled to continue even if some tasks fail
+    if (options.correctGrammar) {
+      tasks.push(
+        this.correctGrammar(text)
+          .then(corrections => {
+            result.corrections = corrections
+            result.corrected = corrections.corrected
+          })
+          .catch(err => {
+            console.warn('Grammar correction failed:', err)
+          })
+      )
+    }
+
+    if (options.extractKeyPoints) {
+      tasks.push(
+        this.extractKeyPoints(text)
+          .then(keyPoints => {
+            result.keyPoints = keyPoints
+          })
+          .catch(err => {
+            console.warn('Key point extraction failed:', err)
+          })
+      )
+    }
+
+    if (options.getSuggestions) {
+      tasks.push(
+        this.getWritingSuggestions(text)
+          .then(suggestions => {
+            result.suggestions = suggestions
+          })
+          .catch(err => {
+            console.warn('Writing suggestions failed:', err)
+          })
+      )
+    }
+
+    if (options.adjustTone) {
+      tasks.push(
+        this.adjustTone(text, options.adjustTone)
+          .then(adjusted => {
+            result.toneAdjusted = adjusted
+          })
+          .catch(err => {
+            console.warn('Tone adjustment failed:', err)
+          })
+      )
+    }
+
+    if (options.expand) {
+      tasks.push(
+        this.expandText(text)
+          .then(expanded => {
+            result.expanded = expanded
+          })
+          .catch(err => {
+            console.warn('Text expansion failed:', err)
+          })
+      )
+    }
+
+    // If no tasks were added, return immediately
+    if (tasks.length === 0) {
+      console.warn('No enhancement tasks were requested')
+      return result
+    }
+
+    console.log(`Running ${tasks.length} enhancement tasks...`)
+    await Promise.all(tasks)
+    console.log('All enhancement tasks completed')
+
+    return result
+  }
+
+  /**
+   * Destroy all service instances and free resources
+   */
+  destroy(): void {
+    this.promptService.destroy()
+    this.writerService.destroy()
+    this.proofreaderService.destroy()
+    this.rewriterService.destroy()
+  }
+
+  /**
+   * Log telemetry for debugging and monitoring
+   * @private
+   */
+  private logTelemetry(telemetry: EnhancementTelemetry): void {
+    console.log('[WritingEnhancement Telemetry]', {
+      timestamp: new Date().toISOString(),
+      ...telemetry,
+    })
+  }
+
+  /**
+   * Score key points quality
+   * @private
+   */
+  private scoreKeyPointsQuality(keyPoints: KeyPoint[]): number {
+    let score = 0
+
+    // Check count (3-5 is ideal)
+    if (keyPoints.length >= 3 && keyPoints.length <= 5) {
+      score += 30
+    } else if (keyPoints.length < 3) {
+      score += 10
+    }
+
+    // Check importance distribution
+    const hasPrimary = keyPoints.some(kp => kp.importance === 'primary')
+    const hasSecondary = keyPoints.some(kp => kp.importance === 'secondary')
+    if (hasPrimary && hasSecondary) {
+      score += 30
+    }
+
+    // Check point lengths (should be concise)
+    const avgLength = keyPoints.reduce((sum, kp) => sum + kp.point.length, 0) / keyPoints.length
+    if (avgLength >= 20 && avgLength <= 100) {
+      score += 20
+    }
+
+    // Check for duplicates
+    const uniquePoints = new Set(keyPoints.map(kp => kp.point.toLowerCase()))
+    if (uniquePoints.size === keyPoints.length) {
+      score += 20
+    }
+
+    return Math.min(score, 100)
+  }
+
+  /**
+   * Score suggestions quality
+   * @private
+   */
+  private scoreSuggestionsQuality(suggestions: WritingSuggestion[]): number {
+    let score = 0
+
+    // Check count (2-4 is ideal)
+    if (suggestions.length >= 2 && suggestions.length <= 4) {
+      score += 30
+    }
+
+    // Check category diversity
+    const uniqueCategories = new Set(suggestions.map(s => s.category))
+    score += Math.min(uniqueCategories.size * 15, 30)
+
+    // Check priority distribution
+    const hasHigh = suggestions.some(s => s.priority === 'high')
+    if (hasHigh) {
+      score += 20
+    }
+
+    // Check for examples
+    const withExamples = suggestions.filter(s => s.example && s.example.length > 0)
+    score += Math.min(withExamples.length * 10, 20)
+
+    return Math.min(score, 100)
+  }
+
+  /**
+   * Validate output length is reasonable
+   * @private
+   */
+  private validateOutputLength(
+    operation: string,
+    inputLength: number,
+    outputLength: number
+  ): void {
+    // For key points: should be shorter than input
+    if (operation === 'extractKeyPoints') {
+      const totalLength = outputLength
+      if (totalLength > inputLength) {
+        console.warn('Key points longer than original text')
+      }
+    }
+
+    // For expansion: should be longer
+    if (operation === 'expandText') {
+      if (outputLength <= inputLength * 1.2) {
+        console.warn('Expanded text not significantly longer')
+      }
+    }
+
+    // General check: not empty
+    if (outputLength === 0) {
+      throw new Error(`${operation} produced empty output`)
+    }
+  }
+
+  /**
+   * Fallback parser for key points when JSON parsing fails
+   * @private
+   */
+  private parseKeyPointsFromText(text: string): KeyPoint[] {
+    // Simple fallback: split by newlines and treat as key points
+    const lines = text.split('\n').filter(line => line.trim())
+    return lines.slice(0, 5).map((line, index) => ({
+      point: line.replace(/^[-*•]\s*/, '').trim(),
+      importance: index === 0 ? 'primary' as const : index < 3 ? 'secondary' as const : 'supporting' as const,
+    }))
+  }
+
+  /**
+   * Fallback parser for suggestions when JSON parsing fails
+   * @private
+   */
+  private parseSuggestionsFromText(text: string): WritingSuggestion[] {
+    // Simple fallback: split by newlines and treat as suggestions
+    const lines = text.split('\n').filter(line => line.trim())
+    return lines.slice(0, 5).map(line => ({
+      category: 'clarity' as const,
+      issue: 'General improvement',
+      suggestion: line.replace(/^[-*•]\s*/, '').trim(),
+      priority: 'medium' as const,
+    }))
+  }
+
+  /**
+   * Parse and validate JSON response for key points
+   * @private
+   */
+  private parseAndValidateKeyPoints(response: string): KeyPoint[] | null {
+    try {
+      // Try to extract JSON from response (handles cases where AI adds text)
+      const jsonMatch = response.match(/\{[\s\S]*\}/)
+      if (!jsonMatch) {
+        return null
+      }
+
+      const parsed = JSON.parse(jsonMatch[0]) as KeyPointsResponse
+
+      // Validate structure
+      if (!parsed.keyPoints || !Array.isArray(parsed.keyPoints)) {
+        console.warn('Invalid keyPoints structure')
+        return null
+      }
+
+      // Validate each key point
+      const validated = parsed.keyPoints.filter(kp => {
+        const hasPoint = typeof kp.point === 'string' && kp.point.trim().length > 0
+        const hasValidImportance = ['primary', 'secondary', 'supporting'].includes(kp.importance)
+        return hasPoint && hasValidImportance
+      })
+
+      if (validated.length === 0) {
+        console.warn('No valid key points after validation')
+        return null
+      }
+
+      return validated
+    } catch (error) {
+      console.warn('JSON parsing failed:', error)
+      return null
+    }
+  }
+
+  /**
+   * Parse and validate JSON response for suggestions
+   * @private
+   */
+  private parseAndValidateSuggestions(response: string): WritingSuggestion[] | null {
+    try {
+      // Try to extract JSON from response
+      const jsonMatch = response.match(/\{[\s\S]*\}/)
+      if (!jsonMatch) {
+        return null
+      }
+
+      const parsed = JSON.parse(jsonMatch[0]) as SuggestionsResponse
+
+      // Validate structure
+      if (!parsed.suggestions || !Array.isArray(parsed.suggestions)) {
+        console.warn('Invalid suggestions structure')
+        return null
+      }
+
+      const validCategories = ['structure', 'clarity', 'engagement', 'conciseness', 'tone']
+      const validPriorities = ['high', 'medium', 'low']
+
+      // Validate each suggestion
+      const validated = parsed.suggestions.filter(sug => {
+        const hasCategory = validCategories.includes(sug.category)
+        const hasIssue = typeof sug.issue === 'string' && sug.issue.trim().length > 0
+        const hasSuggestion = typeof sug.suggestion === 'string' && sug.suggestion.trim().length > 0
+        const hasPriority = validPriorities.includes(sug.priority)
+        return hasCategory && hasIssue && hasSuggestion && hasPriority
+      })
+
+      if (validated.length === 0) {
+        console.warn('No valid suggestions after validation')
+        return null
+      }
+
+      return validated
+    } catch (error) {
+      console.warn('JSON parsing failed:', error)
+      return null
+    }
+  }
+}
diff --git a/src/lib/chrome-ai/services/index.ts b/src/lib/chrome-ai/services/index.ts
index 132a6bf..ebf413a 100644
--- a/src/lib/chrome-ai/services/index.ts
+++ b/src/lib/chrome-ai/services/index.ts
@@ -14,5 +14,29 @@ export type {
 export { PromptService } from './PromptService'
 export type { PromptServiceConfig, PromptInput } from './PromptService'
 
+export { WriterService } from './WriterService'
+export type {
+  WriterServiceConfig,
+  WriteOptions,
+  ExpandTextOptions,
+  AdjustToneOptions,
+} from './WriterService'
+
+export { ProofreaderService } from './ProofreaderService'
+export type {
+  ProofreaderServiceConfig,
+  ProofreadOptions,
+  EnhancedProofreadResult,
+  CorrectionsByType,
+} from './ProofreaderService'
+
+export { WritingEnhancementService } from './WritingEnhancementService'
+export type {
+  WritingSuggestion,
+  KeyPoint,
+  WritingEnhancementResult,
+  EnhanceOptions,
+} from './WritingEnhancementService'
+
 export { ImageAnalysisService } from './ImageAnalysisService'
 export type { ImageAnalysisServiceConfig } from './ImageAnalysisService'
diff --git a/src/lib/chrome-ai/types.ts b/src/lib/chrome-ai/types.ts
index 2134469..44acd83 100644
--- a/src/lib/chrome-ai/types.ts
+++ b/src/lib/chrome-ai/types.ts
@@ -515,6 +515,18 @@ declare global {
    */
   const Summarizer: { availability: () => Promise<AICapabilityAvailability> } | undefined
 
+  /**
+   * The global Writer API factory
+   * @see https://developer.chrome.com/docs/ai/writer-api
+   */
+  const Writer: AIWriterFactory | undefined
+
+  /**
+   * The global Proofreader API factory
+   * @see https://developer.chrome.com/docs/ai/proofreader-api
+   */
+  const Proofreader: AIProofreaderFactory | undefined
+
   interface Window {
     /**
      * Legacy window.ai namespace - may be deprecated in future versions
@@ -814,3 +826,250 @@ export type PromptErrorCode =
   | 'INVALID_INPUT'
   | 'RESPONSE_ERROR'
   | 'UNKNOWN_ERROR'
+
+// Writer API Types
+export type AIWriterTone = 'formal' | 'neutral' | 'casual'
+export type AIWriterFormat = 'markdown' | 'plain-text'
+export type AIWriterLength = 'short' | 'medium' | 'long'
+
+export interface AIWriterCreateOptions {
+  /**
+   * The tone for generated text
+   * @default 'neutral'
+   */
+  tone?: AIWriterTone
+
+  /**
+   * The format of generated text
+   * @default 'plain-text'
+   */
+  format?: AIWriterFormat
+
+  /**
+   * Target length for generated text
+   * @default 'medium'
+   */
+  length?: AIWriterLength
+
+  /**
+   * Shared context that applies to all writing operations
+   * Provides background information for better results
+   */
+  sharedContext?: string
+
+  /**
+   * Expected input languages (BCP 47 codes)
+   */
+  expectedInputLanguages?: string[]
+
+  /**
+   * Expected context languages (BCP 47 codes)
+   */
+  expectedContextLanguages?: string[]
+
+  /**
+   * Output language for generated text
+   */
+  outputLanguage?: string
+
+  /**
+   * Signal to abort ongoing operations
+   */
+  signal?: AbortSignal
+
+  /**
+   * Monitor download progress when model needs to be downloaded
+   */
+  monitor?: (progress: AIModelDownloadProgress) => void
+}
+
+export interface AIWriteOptions {
+  /**
+   * Additional context specific to this writing operation
+   * Complements the sharedContext from create()
+   */
+  context?: string
+
+  /**
+   * Signal to abort this specific write operation
+   */
+  signal?: AbortSignal
+}
+
+export interface AIWriter {
+  /**
+   * Generate text without streaming
+   * @param input - The prompt or text to expand/generate from
+   * @param options - Options for this specific write operation
+   * @returns The generated text
+   */
+  write(input: string, options?: AIWriteOptions): Promise<string>
+
+  /**
+   * Generate text with streaming output
+   * @param input - The prompt or text to expand/generate from
+   * @param options - Options for this specific write operation
+   * @returns An async iterable that yields chunks of the generated text
+   */
+  writeStreaming(input: string, options?: AIWriteOptions): AsyncIterable<string>
+
+  /**
+   * Destroy the writer instance and free up resources
+   */
+  destroy(): void
+}
+
+export interface AIWriterFactory {
+  /**
+   * Create a new writer instance
+   * @param options - Configuration options for the writer
+   * @returns A promise that resolves to a writer instance
+   */
+  create(options?: AIWriterCreateOptions): Promise<AIWriter>
+
+  /**
+   * Check if the writer API is available
+   * @returns A promise that resolves to the availability status
+   */
+  availability(): Promise<AICapabilityAvailability>
+}
+
+// Proofreader API Types
+export interface AIProofreaderCreateOptions {
+  /**
+   * Expected input languages (BCP 47 codes)
+   * @default ['en']
+   */
+  expectedInputLanguages?: string[]
+
+  /**
+   * Signal to abort ongoing operations
+   */
+  signal?: AbortSignal
+
+  /**
+   * Monitor download progress when model needs to be downloaded
+   */
+  monitor?: (progress: AIModelDownloadProgress) => void
+}
+
+export interface Correction {
+  /**
+   * Start position of the error in the original text
+   */
+  startIndex: number
+
+  /**
+   * End position of the error in the original text
+   */
+  endIndex: number
+
+  /**
+   * The original text that needs correction
+   */
+  originalText: string
+
+  /**
+   * The suggested corrected text
+   */
+  suggestedText: string
+
+  /**
+   * Type of error detected
+   */
+  errorType?: 'grammar' | 'spelling' | 'punctuation' | 'style'
+
+  /**
+   * Explanation of why this correction is suggested
+   */
+  explanation?: string
+}
+
+export interface ProofreadResult {
+  /**
+   * The fully corrected text
+   */
+  corrected: string
+
+  /**
+   * Array of individual corrections made
+   */
+  corrections: Correction[]
+}
+
+export interface AIProofreader {
+  /**
+   * Proofread text and return corrections
+   * @param input - The text to proofread
+   * @returns The corrected text and list of corrections
+   */
+  proofread(input: string): Promise<ProofreadResult>
+
+  /**
+   * Destroy the proofreader instance and free up resources
+   */
+  destroy(): void
+}
+
+export interface AIProofreaderFactory {
+  /**
+   * Create a new proofreader instance
+   * @param options - Configuration options for the proofreader
+   * @returns A promise that resolves to a proofreader instance
+   */
+  create(options?: AIProofreaderCreateOptions): Promise<AIProofreader>
+
+  /**
+   * Check if the proofreader API is available
+   * @returns A promise that resolves to the availability status
+   */
+  availability(): Promise<AICapabilityAvailability>
+}
+
+/**
+ * Error codes for Writer API operations
+ *
+ * @remarks
+ * Error code semantics:
+ * - **NOT_AVAILABLE**: API exists in browser but cannot be initialized (needs flags enabled or model download)
+ * - **NOT_SUPPORTED**: API doesn't exist in current browser/version (wrong browser or version too old)
+ * - **INITIALIZATION_FAILED**: API available but writer creation failed (runtime error, invalid options)
+ * - **WRITE_FAILED**: Write operation failed during execution (processing error, context issues)
+ * - **ABORTED**: Operation was cancelled by user via AbortSignal
+ * - **DOWNLOAD_FAILED**: Model download failed (network error, insufficient space)
+ * - **INVALID_INPUT**: User provided invalid input parameters (empty text, invalid options)
+ * - **UNKNOWN_ERROR**: Unexpected error not matching other categories
+ */
+export type WriterErrorCode =
+  | 'NOT_AVAILABLE'
+  | 'NOT_SUPPORTED'
+  | 'INITIALIZATION_FAILED'
+  | 'WRITE_FAILED'
+  | 'ABORTED'
+  | 'DOWNLOAD_FAILED'
+  | 'INVALID_INPUT'
+  | 'UNKNOWN_ERROR'
+
+/**
+ * Error codes for Proofreader API operations
+ *
+ * @remarks
+ * Error code semantics:
+ * - **NOT_AVAILABLE**: API exists in browser but cannot be initialized (needs flags enabled or model download)
+ * - **NOT_SUPPORTED**: API doesn't exist in current browser/version (wrong browser or version too old)
+ * - **INITIALIZATION_FAILED**: API available but proofreader creation failed (runtime error, invalid options)
+ * - **PROOFREAD_FAILED**: Proofread operation failed during execution (processing error, unsupported language)
+ * - **ABORTED**: Operation was cancelled by user via AbortSignal
+ * - **DOWNLOAD_FAILED**: Model download failed (network error, insufficient space)
+ * - **INVALID_INPUT**: User provided invalid input parameters (empty text, invalid options)
+ * - **UNKNOWN_ERROR**: Unexpected error not matching other categories
+ */
+export type ProofreaderErrorCode =
+  | 'NOT_AVAILABLE'
+  | 'NOT_SUPPORTED'
+  | 'INITIALIZATION_FAILED'
+  | 'PROOFREAD_FAILED'
+  | 'ABORTED'
+  | 'DOWNLOAD_FAILED'
+  | 'INVALID_INPUT'
+  | 'UNKNOWN_ERROR'
diff --git a/src/lib/chrome-ai/writer.ts b/src/lib/chrome-ai/writer.ts
new file mode 100644
index 0000000..45f19d7
--- /dev/null
+++ b/src/lib/chrome-ai/writer.ts
@@ -0,0 +1,286 @@
+import { reportError } from '@/lib/errors/report-error'
+import { WriterError, isWriterError, isWriterAbortError } from './errors'
+import { ErrorMessages } from './errors/errorMessages'
+import type {
+  AICapabilityAvailability,
+  AIWriter,
+  AIWriterCreateOptions,
+  AIWriteOptions,
+} from './types'
+
+/**
+ * Check if the Writer API is available in the browser
+ * @returns Promise resolving to availability status
+ * @see https://developer.chrome.com/docs/ai/writer-api
+ */
+export const checkWriterAvailability = async (): Promise<AICapabilityAvailability> => {
+  try {
+    // Check if we're in a browser environment
+    if (typeof self === 'undefined') {
+      return 'unavailable'
+    }
+
+    // Check if Writer API exists (global Writer object)
+    if (!('Writer' in self) || typeof Writer === 'undefined') {
+      return 'unavailable'
+    }
+
+    // Check the availability status
+    const availability = await Writer.availability()
+    return availability
+  } catch (error) {
+    reportError({
+      error,
+      context: { operation: 'checkWriterAvailability' },
+      severity: 'warning',
+      source: 'chrome-ai:writer',
+    })
+    return 'unavailable'
+  }
+}
+
+/**
+ * Check if the Writer API is ready to use (without downloading)
+ * @returns Promise resolving to true if immediately available
+ */
+export const isWriterReady = async (): Promise<boolean> => {
+  const availability = await checkWriterAvailability()
+  return availability === 'available'
+}
+
+/**
+ * Create a Writer instance with the specified configuration
+ * @param options - Configuration options for the writer
+ * @returns Promise resolving to a Writer instance
+ * @throws WriterError if creation fails
+ * @see https://developer.chrome.com/docs/ai/writer-api
+ */
+export const createWriter = async (
+  options?: AIWriterCreateOptions
+): Promise<AIWriter> => {
+  try {
+    // Check if browser environment
+    if (typeof self === 'undefined') {
+      throw new WriterError(ErrorMessages.Writer.browserOnly(), 'NOT_SUPPORTED')
+    }
+
+    // Check if Writer API exists (global Writer object)
+    if (!('Writer' in self) || typeof Writer === 'undefined') {
+      throw new WriterError(ErrorMessages.Writer.notAvailable(), 'NOT_AVAILABLE')
+    }
+
+    // Check availability
+    const availability = await Writer.availability()
+
+    if (availability === 'unavailable') {
+      throw new WriterError(ErrorMessages.Writer.notSupported(), 'NOT_SUPPORTED')
+    }
+
+    // Create the writer instance using global Writer
+    const writer = await Writer.create(options)
+
+    return writer
+  } catch (error) {
+    // Handle known WriterError
+    if (isWriterError(error)) {
+      reportError({
+        error,
+        context: { operation: 'createWriter', options },
+        severity: 'error',
+        source: 'chrome-ai:writer',
+      })
+      throw error
+    }
+
+    // Handle AbortError
+    if (isWriterAbortError(error)) {
+      const abortError = new WriterError(ErrorMessages.Writer.aborted(), 'ABORTED', error)
+      reportError({
+        error: abortError,
+        context: { operation: 'createWriter', options },
+        severity: 'info',
+        source: 'chrome-ai:writer',
+      })
+      throw abortError
+    }
+
+    // Handle other errors
+    const wrappedError = new WriterError(
+      ErrorMessages.Writer.initFailed('create'),
+      'INITIALIZATION_FAILED',
+      error
+    )
+    reportError({
+      error: wrappedError,
+      context: { operation: 'createWriter', options },
+      severity: 'error',
+      source: 'chrome-ai:writer',
+    })
+    throw wrappedError
+  }
+}
+
+/**
+ * Generate text using a writer instance (non-streaming)
+ * @param writer - The writer instance
+ * @param input - The prompt or text to expand/generate from
+ * @param options - Options for this write operation
+ * @returns Promise resolving to the generated text
+ * @throws WriterError if generation fails
+ */
+export const writeText = async (
+  writer: AIWriter,
+  input: string,
+  options?: AIWriteOptions
+): Promise<string> => {
+  try {
+    if (!input || input.trim().length === 0) {
+      throw new WriterError(ErrorMessages.Writer.emptyInput(), 'INVALID_INPUT')
+    }
+
+    const result = await writer.write(input, options)
+    return result
+  } catch (error) {
+    // Handle known WriterError
+    if (isWriterError(error)) {
+      reportError({
+        error,
+        context: { operation: 'writeText', inputLength: input.length, options },
+        severity: error.code === 'ABORTED' ? 'info' : 'error',
+        source: 'chrome-ai:writer',
+      })
+      throw error
+    }
+
+    // Handle AbortError
+    if (isWriterAbortError(error)) {
+      const abortError = new WriterError(ErrorMessages.Writer.aborted(), 'ABORTED', error)
+      reportError({
+        error: abortError,
+        context: { operation: 'writeText', inputLength: input.length, options },
+        severity: 'info',
+        source: 'chrome-ai:writer',
+      })
+      throw abortError
+    }
+
+    // Handle other errors
+    const wrappedError = new WriterError(
+      ErrorMessages.Writer.writeFailed(),
+      'WRITE_FAILED',
+      error
+    )
+    reportError({
+      error: wrappedError,
+      context: { operation: 'writeText', inputLength: input.length, options },
+      severity: 'error',
+      source: 'chrome-ai:writer',
+    })
+    throw wrappedError
+  }
+}
+
+/**
+ * Generate text using streaming output
+ * @param writer - The writer instance
+ * @param input - The prompt or text to expand/generate from
+ * @param options - Options for this write operation
+ * @returns AsyncIterable that yields chunks of generated text
+ */
+export const writeTextStreaming = async function* (
+  writer: AIWriter,
+  input: string,
+  options?: AIWriteOptions
+): AsyncIterable<string> {
+  try {
+    if (!input || input.trim().length === 0) {
+      throw new WriterError(ErrorMessages.Writer.emptyInput(), 'INVALID_INPUT')
+    }
+
+    const stream = writer.writeStreaming(input, options)
+
+    for await (const chunk of stream) {
+      yield chunk
+    }
+  } catch (error) {
+    // Handle known WriterError
+    if (isWriterError(error)) {
+      reportError({
+        error,
+        context: { operation: 'writeTextStreaming', inputLength: input.length, options },
+        severity: error.code === 'ABORTED' ? 'info' : 'error',
+        source: 'chrome-ai:writer',
+      })
+      throw error
+    }
+
+    // Handle AbortError
+    if (isWriterAbortError(error)) {
+      const abortError = new WriterError(ErrorMessages.Writer.aborted(), 'ABORTED', error)
+      reportError({
+        error: abortError,
+        context: { operation: 'writeTextStreaming', inputLength: input.length, options },
+        severity: 'info',
+        source: 'chrome-ai:writer',
+      })
+      throw abortError
+    }
+
+    // Handle other errors
+    const wrappedError = new WriterError(
+      ErrorMessages.Writer.writeFailed('streaming'),
+      'WRITE_FAILED',
+      error
+    )
+    reportError({
+      error: wrappedError,
+      context: { operation: 'writeTextStreaming', inputLength: input.length, options },
+      severity: 'error',
+      source: 'chrome-ai:writer',
+    })
+    throw wrappedError
+  }
+}
+
+/**
+ * Destroy a writer instance and free resources
+ * @param writer - The writer instance to destroy
+ */
+export const destroyWriter = (writer: AIWriter): void => {
+  try {
+    writer.destroy()
+  } catch (error) {
+    reportError({
+      error,
+      context: { operation: 'destroyWriter' },
+      severity: 'warning',
+      source: 'chrome-ai:writer',
+    })
+  }
+}
+
+/**
+ * High-level utility to generate text with automatic instance management
+ * Creates a writer, performs the generation, and cleans up automatically
+ * @param input - The prompt or text to expand/generate from
+ * @param createOptions - Options for creating the writer
+ * @param writeOptions - Options for the write operation
+ * @returns Promise resolving to the generated text
+ */
+export const writeWithAutoCleanup = async (
+  input: string,
+  createOptions?: AIWriterCreateOptions,
+  writeOptions?: AIWriteOptions
+): Promise<string> => {
+  let writer: AIWriter | null = null
+
+  try {
+    writer = await createWriter(createOptions)
+    const result = await writeText(writer, input, writeOptions)
+    return result
+  } finally {
+    if (writer) {
+      destroyWriter(writer)
+    }
+  }
+}
diff --git a/src/pages/test/WritingEnhancementTestPage.tsx b/src/pages/test/WritingEnhancementTestPage.tsx
new file mode 100644
index 0000000..a164ef3
--- /dev/null
+++ b/src/pages/test/WritingEnhancementTestPage.tsx
@@ -0,0 +1,5 @@
+import { WritingEnhancementTest } from '@/components/test/WritingEnhancementTest'
+
+export const WritingEnhancementTestPage = () => {
+  return <WritingEnhancementTest />
+}
diff --git a/src/pages/workspace/WorkspacePage.tsx b/src/pages/workspace/WorkspacePage.tsx
index 4449118..7bab71f 100644
--- a/src/pages/workspace/WorkspacePage.tsx
+++ b/src/pages/workspace/WorkspacePage.tsx
@@ -7,12 +7,13 @@ import { ExtractedContent } from '@/components/content/ExtractedContent'
 import { FormattedOutput } from '@/components/output'
 import { FormatQuickSelector } from '@/components/workspace/FormatQuickSelector'
 import { ComparisonView } from '@/components/content/ComparisonView'
+import { WritingEnhancementPanel } from '@/components/writing/WritingEnhancementPanel'
 import { useFileUpload } from '@/hooks/useFileUpload'
 import { useContentExtraction } from '@/hooks/useContentExtraction'
 import { loadPreferences, persistPreferences, PreferenceKey } from '@/lib/storage/preferences'
 import type { FormatType } from '@/lib/chrome-ai/types'
 
-type InputMode = 'text' | 'file' | 'url'
+type InputMode = 'text' | 'file' | 'url' | 'writing-enhancement'
 type ViewMode = 'output' | 'comparison'
 
 export const WorkspacePage = () => {
@@ -273,14 +274,56 @@ export const WorkspacePage = () => {
               URL Extraction
             </span>
           </button>
+          <button
+            type="button"
+            onClick={() => {
+              if (inputMode !== 'writing-enhancement') {
+                setProcessedResult(null)
+                setOriginalText('')
+                setViewMode('output')
+              }
+              setInputMode('writing-enhancement')
+            }}
+            className={`flex-1 rounded-lg px-4 py-2 text-sm font-semibold transition ${
+              inputMode === 'writing-enhancement'
+                ? 'bg-primary-600 text-white shadow-sm'
+                : 'text-neutral-600 hover:bg-neutral-50 hover:text-neutral-900'
+            }`}
+          >
+            <span className="flex items-center justify-center gap-2">
+              <svg className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                  strokeWidth={2}
+                  d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"
+                />
+              </svg>
+              Writing Enhancement
+            </span>
+          </button>
         </div>
       </section>
 
       {/* Main content grid */}
-      <div className="grid gap-8 lg:grid-cols-2">
-        {/* Input panel */}
+      {inputMode === 'writing-enhancement' ? (
+        // Full-width writing enhancement panel
         <section className="rounded-3xl border border-neutral-200 bg-white p-8 shadow-soft">
-          {inputMode === 'text' ? (
+          <div className="mb-6">
+            <h2 className="font-display text-2xl font-semibold text-neutral-900">
+              Writing Enhancement
+            </h2>
+            <p className="mt-1 text-sm text-neutral-600">
+              Improve your writing with AI-powered grammar correction, tone adjustment, and suggestions
+            </p>
+          </div>
+          <WritingEnhancementPanel />
+        </section>
+      ) : (
+        <div className="grid gap-8 lg:grid-cols-2">
+          {/* Input panel */}
+          <section className="rounded-3xl border border-neutral-200 bg-white p-8 shadow-soft">
+            {inputMode === 'text' ? (
             <TextInputPanel
               key={textInputKey}
               onProcessingComplete={handleProcessingComplete}
@@ -683,32 +726,34 @@ export const WorkspacePage = () => {
             </div>
           </div>
         </section>
-      </div>
+        </div>
+      )}
 
       {/* Info section */}
-      <section className="rounded-2xl border border-dashed border-primary-200 bg-primary-50/50 p-6">
-        <div className="flex items-start gap-4">
-          <div className="rounded-lg bg-primary-100 p-2">
-            <svg
-              className="h-5 w-5 text-primary-600"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke="currentColor"
-              aria-hidden="true"
-            >
-              <path
-                strokeLinecap="round"
-                strokeLinejoin="round"
-                strokeWidth={2}
-                d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-              />
-            </svg>
-          </div>
-          <div className="flex-1">
-            <h3 className="font-semibold text-neutral-900">
-              {inputMode === 'text' ? 'Keyboard shortcuts' : inputMode === 'file' ? 'Supported formats' : 'Note about CORS'}
-            </h3>
-            {inputMode === 'text' ? (
+      {inputMode !== 'writing-enhancement' && (
+        <section className="rounded-2xl border border-dashed border-primary-200 bg-primary-50/50 p-6">
+          <div className="flex items-start gap-4">
+            <div className="rounded-lg bg-primary-100 p-2">
+              <svg
+                className="h-5 w-5 text-primary-600"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor"
+                aria-hidden="true"
+              >
+                <path
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                  strokeWidth={2}
+                  d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+                />
+              </svg>
+            </div>
+            <div className="flex-1">
+              <h3 className="font-semibold text-neutral-900">
+                {inputMode === 'text' ? 'Keyboard shortcuts' : inputMode === 'file' ? 'Supported formats' : 'Note about CORS'}
+              </h3>
+              {inputMode === 'text' ? (
               <div className="mt-2 grid gap-2 text-sm text-neutral-700 sm:grid-cols-2">
                 <div className="flex items-center gap-2">
                   <kbd className="rounded bg-white px-2 py-1 font-mono text-xs shadow-sm">
@@ -734,9 +779,10 @@ export const WorkspacePage = () => {
                 extension that enables CORS.
               </p>
             )}
+            </div>
           </div>
-        </div>
-      </section>
+        </section>
+      )}
     </div>
   )
 }
diff --git a/src/routes/app-router.tsx b/src/routes/app-router.tsx
index 4acd76a..9406be1 100644
--- a/src/routes/app-router.tsx
+++ b/src/routes/app-router.tsx
@@ -9,6 +9,7 @@ import { RewriterTestPage } from '@/pages/test/RewriterTestPage'
 import { TranslatorTestPage } from '@/pages/test/TranslatorTestPage'
 import { PromptTestPage } from '@/pages/test/PromptTestPage'
 import { ContentExtractionTest } from '@/pages/test/ContentExtractionTest'
+import { WritingEnhancementTestPage } from '@/pages/test/WritingEnhancementTestPage'
 import { RouteErrorBoundary } from '@/routes/route-error-boundary'
 
 export const appRouter = createBrowserRouter(
@@ -22,6 +23,7 @@ export const appRouter = createBrowserRouter(
       <Route path="demos/rewriter" element={<RewriterTestPage />} />
       <Route path="demos/translator" element={<TranslatorTestPage />} />
       <Route path="demos/prompt" element={<PromptTestPage />} />
+      <Route path="demos/writing-enhancement" element={<WritingEnhancementTestPage />} />
       {/* Legacy test routes (redirect to demos) */}
       <Route path="test/rewriter" element={<RewriterTestPage />} />
       <Route path="test/content-extraction" element={<ContentExtractionTest />} />