diff --git a/lib/command-palette-view.coffee b/lib/command-palette-view.coffee
index a594e70..82faacd 100644
--- a/lib/command-palette-view.coffee
+++ b/lib/command-palette-view.coffee
@@ -1,5 +1,6 @@
 _ = require 'underscore-plus'
-{$, $$, SelectListView} = require 'atom'
+{$, $$} = require 'space-pen'
+{SelectListView} = require 'atom-space-pen-views'
 
 module.exports =
 class CommandPaletteView extends SelectListView
@@ -11,19 +12,24 @@ class CommandPaletteView extends SelectListView
   initialize: ->
     super
 
-    @addClass('command-palette overlay from-top')
+    @addClass('command-palette')
     atom.workspaceView.command 'command-palette:toggle', => @toggle()
 
   getFilterKey: ->
     'displayName'
 
+  cancelled: -> @hide()
+
   toggle: ->
-    if @hasParent()
+    if @panel?.isVisible()
       @cancel()
     else
-      @attach()
+      @show()
+
+  show: ->
+    @panel ?= atom.workspace.addModalPanel(item: this)
+    @panel.show()
 
-  attach: ->
     @storeFocusedElement()
 
     if @previouslyFocusedElement[0] and @previouslyFocusedElement[0] isnt document.body
@@ -42,10 +48,12 @@ class CommandPaletteView extends SelectListView
     commands = _.sortBy(commands, 'displayName')
     @setItems(commands)
 
-    atom.workspaceView.append(this)
     @focusFilterEditor()
 
-  viewForItem: ({name, displayName}) ->
+  hide: ->
+    @panel?.hide()
+
+  viewForItem: ({name, displayName, eventDescription}) ->
     keyBindings = @keyBindings
     $$ ->
       @li class: 'event', 'data-event-name': name, =>
diff --git a/package.json b/package.json
index cd00c1a..0412e4e 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,8 @@
     "atom": "*"
   },
   "dependencies": {
+    "space-pen": "^3.8.1",
+    "atom-space-pen-views": "^0.15.0",
     "underscore-plus": "1.x"
   }
 }
diff --git a/spec/command-palette-spec.coffee b/spec/command-palette-spec.coffee
index cbfc9f3..5ae9207 100644
--- a/spec/command-palette-spec.coffee
+++ b/spec/command-palette-spec.coffee
@@ -61,7 +61,7 @@ describe "CommandPalette", ->
           expect(eventLi).not.toExist()
 
     it "focuses the mini-editor and selects the first command", ->
-      expect(palette.filterEditorView.isFocused).toBeTruthy()
+      expect(palette.filterEditorView.hasFocus()).toBeTruthy()
       expect(palette.find('.event:first')).toHaveClass 'selected'
 
     it "clears the previous mini editor text", ->
@@ -71,21 +71,21 @@ describe "CommandPalette", ->
       expect(palette.filterEditorView.getText()).toBe ''
 
   describe "when command-palette:toggle is triggered on the open command palette", ->
-    it "focus the root view and detaches the command palette", ->
-      expect(palette.hasParent()).toBeTruthy()
-      palette.trigger 'command-palette:toggle'
-      expect(palette.hasParent()).toBeFalsy()
+    it "focus the root view and hides the command palette", ->
+      expect(palette.isVisible()).toBeTruthy()
+      atom.commands.dispatch palette[0], 'command-palette:toggle'
+      expect(palette.is(':visible')).toBeFalsy()
       expect(atom.workspaceView.getActiveView().isFocused).toBeTruthy()
 
   describe "when the command palette is cancelled", ->
-    it "focuses the root view and detaches the command palette", ->
-      expect(palette.hasParent()).toBeTruthy()
+    it "focuses the root view and hides the command palette", ->
+      expect(palette.is(':visible')).toBeTruthy()
       palette.cancel()
-      expect(palette.hasParent()).toBeFalsy()
+      expect(palette.is(':visible')).toBeFalsy()
       expect(atom.workspaceView.getActiveView().isFocused).toBeTruthy()
 
   describe "when an command selection is confirmed", ->
-    it "detaches the palette, then focuses the previously focused element and emits the selected command on it", ->
+    it "hides the palette, then focuses the previously focused element and emits the selected command on it", ->
       eventHandler = jasmine.createSpy('eventHandler').andReturn(false)
       activeEditor = atom.workspaceView.getActiveView()
       eventName = palette.items[3].name
@@ -96,7 +96,7 @@ describe "CommandPalette", ->
 
       expect(activeEditor.isFocused).toBeTruthy()
       expect(eventHandler).toHaveBeenCalled()
-      expect(palette.hasParent()).toBeFalsy()
+      expect(palette.is(':visible')).toBeFalsy()
 
   describe "when no element has focus", ->
     it "uses the root view as the element to display and trigger events for", ->