diff --git a/lib/view/account-header.js b/lib/view/account-header.js
index 227ee89..5bb4e98 100644
--- a/lib/view/account-header.js
+++ b/lib/view/account-header.js
@@ -7,10 +7,9 @@ const HOVER_BACKGROUND = '#2B2E3B'
 const PADDING = 10
 
 class AccountHeader {
-  constructor(account) {
+  constructor() {
     this.account = null
 
-    this.font = gui.Font.default().derive(8, 'semi-bold', 'normal')
     this.hover = false
 
     // Toggle the menu when clicking on the panel.
@@ -47,6 +46,11 @@ class AccountHeader {
 
   loadAccount(account) {
     this.account = account
+    this.text = gui.AttributedText.create(this.account.name, {
+      font: gui.Font.default().derive(8, 'semi-bold', 'normal'),
+      color: ACCOUNT_NAME_COLOR,
+      valign: 'center'
+    })
     this.view.schedulePaint()
   }
 
@@ -62,10 +66,11 @@ class AccountHeader {
       painter.setFillColor(HOVER_BACKGROUND)
       painter.fillRect(bounds)
     }
-    const attributes = { font: this.font, color: ACCOUNT_NAME_COLOR }
-    bounds.x = PADDING
-    bounds.y = PADDING
-    painter.drawText(this.account.name, bounds, attributes)
+    if (this.text) {
+      bounds.x = PADDING
+      bounds.width -= PADDING
+      painter.drawAttributedText(this.text, bounds)
+    }
   }
 }
 
diff --git a/lib/view/channel-item.js b/lib/view/channel-item.js
index edf0073..0493d63 100644
--- a/lib/view/channel-item.js
+++ b/lib/view/channel-item.js
@@ -68,6 +68,7 @@ class ChannelItem {
     const attributes = {
       color: theme.channelItem.normalColor,
       valign: 'center',
+      wrap: false,
     }
     let padding = theme.channelItem.padding
     if (this.channel.type === 'dm')
diff --git a/package.json b/package.json
index 20f58fd..eb1620a 100644
--- a/package.json
+++ b/package.json
@@ -30,7 +30,7 @@
     "binary-search-bounds": "2.0.4",
     "fetch-yode": "1.0.x",
     "fs-extra": "5.0.0",
-    "gui": "0.8.1",
+    "gui": "0.8.3-2",
     "keytar": "5.4.0",
     "mini-signals": "1.1.1",
     "opn": "5.3.0",