diff --git a/Note/Color+Hex.swift b/Note/Color+Hex.swift
deleted file mode 100644
index 348d729..0000000
--- a/Note/Color+Hex.swift
+++ /dev/null
@@ -1,38 +0,0 @@
-//
-//  Color+Hex.swift
-//  Note
-//
-//  Created by fish on 2026/7/12.
-//
-
-import SwiftUI
-
-extension Color {
-    init(hex: String) {
-        let trimmed = hex.trimmingCharacters(in: CharacterSet.alphanumerics.inverted)
-        var int: UInt64 = 0
-        Scanner(string: trimmed).scanHexInt64(&int)
-        let r, g, b: UInt64
-        switch trimmed.count {
-        case 6:
-            r = (int >> 16) & 0xFF
-            g = (int >> 8) & 0xFF
-            b = int & 0xFF
-        case 8:
-            r = (int >> 16) & 0xFF
-            g = (int >> 8) & 0xFF
-            b = int & 0xFF
-        default:
-            r = 0
-            g = 0
-            b = 0
-        }
-        self.init(
-            .sRGB,
-            red: Double(r) / 255,
-            green: Double(g) / 255,
-            blue: Double(b) / 255,
-            opacity: 1
-        )
-    }
-}
diff --git a/Note/FormatterView.swift b/Note/FormatterView.swift
index 917f2c8..4bad4ad 100644
--- a/Note/FormatterView.swift
+++ b/Note/FormatterView.swift
@@ -15,74 +15,14 @@ struct FormatterView: View {
 
     var body: some View {
         NavigationStack {
-            VStack(spacing: 0) {
-                headerView
-                    .background(Color(hex: "f2f2f7"))
-
-                ScrollView {
-                    VStack(spacing: 16) {
-                        TextEditor(text: $inputText)
-                            .frame(minHeight: 160)
-                            .padding(8)
-                            .background(Color(.systemBackground))
-                            .cornerRadius(8)
-                            .overlay(
-                                RoundedRectangle(cornerRadius: 8)
-                                    .stroke(Color(.systemGray4), lineWidth: 1)
-                            )
-                            .toolbar {
-                                ToolbarItemGroup(placement: .keyboard) {
-                                    Spacer()
-                                    Button("完成") {
-                                        dismissKeyboard()
-                                    }
-                                }
-                            }
-
-                        Button(action: formatText) {
-                            Label("格式化", systemImage: "wand.and.stars")
-                                .font(.headline)
-                                .frame(maxWidth: .infinity)
-                                .padding()
-                                .background(Color.accentColor)
-                                .foregroundStyle(.white)
-                                .cornerRadius(10)
-                        }
-
-                        if !outputText.isEmpty {
-                            VStack(alignment: .leading, spacing: 8) {
-                                HStack {
-                                    Text("格式化结果")
-                                        .font(.subheadline)
-                                        .foregroundStyle(.secondary)
-                                    Spacer()
-                                    Button(action: copyOutput) {
-                                        Image(systemName: "doc.on.doc")
-                                    }
-                                }
-
-                                TextEditor(text: .constant(outputText))
-                                    .frame(minHeight: 160)
-                                    .padding(8)
-                                    .background(Color(.systemBackground))
-                                    .cornerRadius(8)
-                                    .overlay(
-                                        RoundedRectangle(cornerRadius: 8)
-                                            .stroke(Color(.systemGray4), lineWidth: 1)
-                                    )
-                            }
-                        }
-
-                        Spacer(minLength: 16)
-                    }
-                    .padding()
-                }
-                .background(Color(hex: "f2f2f7"))
-            }
-            .background(Color(hex: "f2f2f7").ignoresSafeArea())
-            .onTapGesture {
-                dismissKeyboard()
+            List {
+                inputSection
+                actionSection
+                resultSection
             }
+            .listStyle(.insetGrouped)
+            .navigationTitle("文案格式化")
+            .background(Color(.systemGroupedBackground).ignoresSafeArea())
             .alert("提示", isPresented: $showEmptyAlert) {
                 Button("确定", role: .cancel) {}
             } message: {
@@ -104,24 +44,65 @@ struct FormatterView: View {
                     .transition(.opacity)
                 }
             }
-            .navigationBarHidden(true)
         }
     }
 
-    private var headerView: some View {
-        HStack {
-            Text("文案格式化")
-                .font(.largeTitle.bold())
-                .foregroundStyle(.primary)
-            Spacer()
+    private var inputSection: some View {
+        Section {
+            TextEditor(text: $inputText)
+                .frame(minHeight: 160)
+                .scrollContentBackground(.hidden)
+                .background(Color(.secondarySystemGroupedBackground))
+                .toolbar {
+                    ToolbarItemGroup(placement: .keyboard) {
+                        Spacer()
+                        Button("完成") {
+                            dismissKeyboard()
+                        }
+                    }
+                }
+        } header: {
+            Text("输入")
+        } footer: {
+            Text("粘贴需要格式化的文案")
         }
-        .frame(maxWidth: .infinity, minHeight: 44)
-        .padding(.horizontal)
-        .padding(.top, 8)
-        .padding(.bottom, 8)
-        .contentShape(Rectangle())
-        .onTapGesture {
-            dismissKeyboard()
+    }
+
+    private var actionSection: some View {
+        Section {
+            Button(action: formatText) {
+                HStack {
+                    Spacer()
+                    Label("格式化", systemImage: "wand.and.stars")
+                        .font(.headline)
+                    Spacer()
+                }
+            }
+        }
+    }
+
+    private var resultSection: some View {
+        Section {
+            if outputText.isEmpty {
+                Text("点击上方按钮生成格式化结果")
+                    .foregroundStyle(.secondary)
+            } else {
+                TextEditor(text: .constant(outputText))
+                    .frame(minHeight: 160)
+                    .scrollContentBackground(.hidden)
+                    .background(Color(.secondarySystemGroupedBackground))
+            }
+        } header: {
+            HStack {
+                Text("格式化结果")
+                Spacer()
+                if !outputText.isEmpty {
+                    Button(action: copyOutput) {
+                        Image(systemName: "doc.on.doc")
+                    }
+                    .font(.subheadline)
+                }
+            }
         }
     }
 
@@ -167,6 +148,7 @@ struct FormatterView: View {
         content = content.replacingOccurrences(of: "三、工作方面", with: "## 三、工作方面")
 
         outputText = content
+        dismissKeyboard()
     }
 
     private func copyOutput() {