diff --git a/package.json b/package.json
index f40856df..4279ca9a 100644
--- a/package.json
+++ b/package.json
@@ -82,7 +82,7 @@
     "redux-thunk": "^2.2.0",
     "shortid": "^2.2.8",
     "source-map-support": "^0.5.3",
-    "styled-components": "^3.0.2",
+    "styled-components": "^3.1.1",
     "styled-system": "^1.1.1"
   },
   "devDependencies": {
@@ -120,7 +120,7 @@
     "lint-staged": "^6.1.0",
     "node-loader": "^0.6.0",
     "prettier": "^1.10.2",
-    "react-hot-loader": "^4.0.0-beta.17",
+    "react-hot-loader": "^4.0.0-beta.18",
     "webpack": "^3.10.0"
   }
 }
diff --git a/src/components/AccountPage.js b/src/components/AccountPage.js
index 0ace4d77..5de58ea0 100644
--- a/src/components/AccountPage.js
+++ b/src/components/AccountPage.js
@@ -39,7 +39,7 @@ class AccountPage extends PureComponent<Props> {
             <Box horizontal flow={3}>
               <Box grow>
                 <Card title="Balance" style={{ height: 435 }} align="center" justify="center">
-                  <Text fontSize={6}>{formatBTC(accountData.balance)}</Text>
+                  <Text fontSize={5}>{formatBTC(accountData.balance)}</Text>
                 </Card>
               </Box>
 
diff --git a/src/components/modals/AddAccount/CreateAccount.js b/src/components/modals/AddAccount/CreateAccount.js
new file mode 100644
index 00000000..1cfe40c6
--- /dev/null
+++ b/src/components/modals/AddAccount/CreateAccount.js
@@ -0,0 +1,69 @@
+// @flow
+
+import React, { PureComponent } from 'react'
+
+import Box from 'components/base/Box'
+import Button from 'components/base/Button'
+import Input from 'components/base/Input'
+import Label from 'components/base/Label'
+
+type Props = {
+  account: Object,
+  onAddAccount: Function,
+}
+
+type State = {
+  accountName: string,
+}
+
+class CreateAccount extends PureComponent<Props, State> {
+  state = {
+    accountName: '',
+  }
+
+  handleCreateAccount = (e: SyntheticEvent<HTMLFormElement>) => {
+    e.preventDefault()
+
+    const { accountName } = this.state
+    const { onAddAccount, account } = this.props
+
+    if (accountName.trim() === '') {
+      return
+    }
+
+    onAddAccount({
+      ...account,
+      name: accountName,
+    })
+  }
+
+  handleChangeInput = (value: string) =>
+    this.setState({
+      accountName: value,
+    })
+
+  render() {
+    const { accountName } = this.state
+
+    return (
+      <Box>
+        <Box>Create Account</Box>
+        <form onSubmit={this.handleCreateAccount}>
+          <Box flow={3}>
+            <Box flow={1}>
+              <Label>Account name</Label>
+              <Input value={accountName} onChange={this.handleChangeInput} />
+            </Box>
+            <Box horizontal justify="flex-end">
+              <Button primary type="submit">
+                Create
+              </Button>
+            </Box>
+          </Box>
+        </form>
+      </Box>
+    )
+  }
+}
+
+export default CreateAccount
diff --git a/src/components/modals/AddAccount/ImportAccounts.js b/src/components/modals/AddAccount/ImportAccounts.js
index 493ac968..f6bbc805 100644
--- a/src/components/modals/AddAccount/ImportAccounts.js
+++ b/src/components/modals/AddAccount/ImportAccounts.js
@@ -55,7 +55,9 @@ class ImportAccounts extends PureComponent<Props, State> {
       },
     }))
 
-  handleImportAccounts = () => {
+  handleImportAccounts = (e: SyntheticEvent<HTMLFormElement>) => {
+    e.preventDefault()
+
     const { accounts, onImportAccounts } = this.props
     const { accountsSelected, accountsName } = this.state
 
@@ -76,40 +78,42 @@ class ImportAccounts extends PureComponent<Props, State> {
     return (
       <Box>
         <Box>Import Accounts</Box>
-        <Box>
-          {accounts.map(account => {
-            const selected = accountsSelected.includes(account.id)
-            const accountName = accountsName[account.id]
-            return (
-              <Box key={account.id} horizontal flow={10}>
-                <Box>
-                  <Checkbox
-                    checked={selected}
-                    onChange={this.handleSelectAccount(account.id, selected)}
-                  />
-                </Box>
-                <Box>
+        <form onSubmit={this.handleImportAccounts}>
+          <Box flow={3}>
+            {accounts.map(account => {
+              const selected = accountsSelected.includes(account.id)
+              const accountName = accountsName[account.id]
+              return (
+                <Box key={account.id} horizontal flow={10}>
                   <Box>
-                    <Input
-                      type="text"
-                      disabled={!selected}
-                      placeholder={accountName.placeholder}
-                      value={accountName.value || ''}
-                      onChange={this.handleChangeInput(account.id)}
+                    <Checkbox
+                      checked={selected}
+                      onChange={this.handleSelectAccount(account.id, selected)}
                     />
                   </Box>
-                  <Box>Balance: {formatBTC(account.balance)}</Box>
-                  <Box>Transactions: {account.transactions.length}</Box>
+                  <Box grow>
+                    <Box>
+                      <Input
+                        type="text"
+                        disabled={!selected}
+                        placeholder={accountName.placeholder}
+                        value={accountName.value || ''}
+                        onChange={this.handleChangeInput(account.id)}
+                      />
+                    </Box>
+                    <Box>Balance: {formatBTC(account.balance)}</Box>
+                    <Box>Transactions: {account.transactions.length}</Box>
+                  </Box>
                 </Box>
-              </Box>
-            )
-          })}
-        </Box>
-        <Box>
-          <Button primary disabled={!canImportAccounts} onClick={this.handleImportAccounts}>
-            Import accounts
-          </Button>
-        </Box>
+              )
+            })}
+            <Box horizontal justify="flex-end">
+              <Button primary disabled={!canImportAccounts} type="submit">
+                Import
+              </Button>
+            </Box>
+          </Box>
+        </form>
       </Box>
     )
   }
diff --git a/src/components/modals/AddAccount/index.js b/src/components/modals/AddAccount/index.js
index 5e8e879c..0b5e008e 100644
--- a/src/components/modals/AddAccount/index.js
+++ b/src/components/modals/AddAccount/index.js
@@ -17,15 +17,15 @@ import { addAccount } from 'actions/accounts'
 import Box from 'components/base/Box'
 import Text from 'components/base/Text'
 import Button from 'components/base/Button'
-import Input from 'components/base/Input'
 import Label from 'components/base/Label'
 import Modal, { ModalBody } from 'components/base/Modal'
 import Select from 'components/base/Select'
 
+import CreateAccount from './CreateAccount'
 import ImportAccounts from './ImportAccounts'
 
 const Steps = {
-  createAccount: (props: Object) => (
+  chooseWallet: (props: Object) => (
     <form onSubmit={props.onSubmit}>
       <Box flow={3}>
         <Box flow={1}>
@@ -42,10 +42,6 @@ const Steps = {
             ]}
           />
         </Box>
-        <Box flow={1}>
-          <Label>Account name</Label>
-          <Input onChange={props.onChangeInput('accountName')} value={props.value.accountName} />
-        </Box>
         <Box horizontal justify="flex-end">
           <Button primary type="submit">
             Add account
@@ -55,75 +51,45 @@ const Steps = {
     </form>
   ),
   connectDevice: (props: Object) => (
-    <div>
-      <div>Connect your Ledger: {props.connected ? 'ok' : 'ko'}</div>
-      <div>Start {props.wallet.toUpperCase()} App on your Ledger: ko</div>
-    </div>
+    <Box>
+      <Box>Connect your Ledger: {props.connected ? 'ok' : 'ko'}</Box>
+      <Box>Start {props.wallet.toUpperCase()} App on your Ledger: ko</Box>
+    </Box>
   ),
   inProgress: (props: Object) => (
-    <div>
+    <Box>
       In progress.
       {props.progress !== null && (
-        <div>
+        <Box>
           Account: {props.progress.account} / Transactions: {props.progress.transactions}
-        </div>
+        </Box>
       )}
-    </div>
+    </Box>
   ),
   listAccounts: (props: Object) => {
     const accounts = Object.entries(props.accounts).map(([, account]: [string, any]) => account)
+    const emptyAccounts = accounts.filter(account => account.transactions.length === 0)
     const existingAccounts = accounts.filter(account => account.transactions.length > 0)
-    // const newAccount = accounts.find(account => account.transactions.length === 0)
+    const canCreateAccount = props.canCreateAccount && emptyAccounts.length === 1
+    const newAccount = emptyAccounts[0]
     return (
-      <Box>
+      <Box flow={10}>
         <ImportAccounts {...props} accounts={existingAccounts} />
+        {canCreateAccount ? (
+          <CreateAccount {...props} account={newAccount} />
+        ) : (
+          <Box>{`You can't create new account`}</Box>
+        )}
       </Box>
     )
   },
-  // listAccounts: (props: Object) => {
-  //   const accounts = []
-  //
-  //   let newAccount = null
-  //
-  //   Object.entries(props.accounts).forEach(([, account]: [string, any]) => {
-  //     const hasTransactions = account.transactions.length > 0
-  //
-  //     if (hasTransactions) {
-  //       accounts.push(account)
-  //     } else {
-  //       newAccount = account
-  //     }
-  //   })
-  //
-  //   return (
-  //     <div>
-  //       {accounts.map(account => (
-  //         <div key={account.id} style={{ marginBottom: 10 }}>
-  //           <div>Balance: {formatBTC(account.balance)}</div>
-  //           <div>Transactions: {account.transactions.length}</div>
-  //           <div>
-  //             <Button onClick={props.onAddAccount(account)}>Import</Button>
-  //           </div>
-  //         </div>
-  //       ))}
-  //       {props.canCreateAccount && newAccount !== null ? (
-  //         <div>
-  //           <Button onClick={props.onAddAccount(newAccount)}>Create new account</Button>
-  //         </div>
-  //       ) : (
-  //         <div>You cannot create new account</div>
-  //       )}
-  //     </div>
-  //   )
-  // },
 }
 
 type InputValue = {
-  accountName: string,
   wallet: string,
 }
 
-type Step = 'createAccount' | 'connectDevice' | 'inProgress' | 'listAccounts'
+type Step = 'chooseWallet' | 'connectDevice' | 'inProgress' | 'listAccounts'
 
 type Props = {
   accounts: Accounts,
@@ -152,12 +118,11 @@ const mapDispatchToProps = {
 
 const defaultState = {
   inputValue: {
-    accountName: '',
     wallet: '',
   },
   accounts: {},
   progress: null,
-  step: 'createAccount',
+  step: 'chooseWallet',
 }
 
 class AddAccountModal extends PureComponent<Props, State> {
@@ -207,7 +172,7 @@ class AddAccountModal extends PureComponent<Props, State> {
     const props = (predicate, props) => (predicate ? props : {})
 
     return {
-      ...props(step === 'createAccount', {
+      ...props(step === 'chooseWallet', {
         value: inputValue,
         onSubmit: this.handleSubmit,
         onChangeInput: this.handleChangeInput,
@@ -248,33 +213,9 @@ class AddAccountModal extends PureComponent<Props, State> {
     }
   }
 
-  handleAddAccount = account => () => {
-    const { inputValue } = this.state
-    const { addAccount } = this.props
-
-    const { id, ...data } = account
-
-    addAccount({
-      id,
-      name: inputValue.accountName,
-      type: inputValue.wallet,
-      data,
-    })
-  }
-
-  handleImportAccounts = accountsSelected => {
-    const { inputValue } = this.state
-    const { addAccount } = this.props
+  handleAddAccount = account => this.addAccount(account)
 
-    accountsSelected.forEach(({ id, name, ...account }) =>
-      addAccount({
-        id,
-        name,
-        type: inputValue.wallet,
-        data: account,
-      }),
-    )
-  }
+  handleImportAccounts = accounts => accounts.forEach(account => this.addAccount(account))
 
   handleChangeInput = (key: $Keys<InputValue>) => (value: $Values<InputValue>) =>
     this.setState(prev => ({
@@ -289,7 +230,7 @@ class AddAccountModal extends PureComponent<Props, State> {
 
     const { inputValue } = this.state
 
-    if (inputValue.accountName.trim() === '' || inputValue.wallet.trim() === '') {
+    if (inputValue.wallet.trim() === '') {
       return
     }
 
@@ -305,6 +246,18 @@ class AddAccountModal extends PureComponent<Props, State> {
     })
   }
 
+  addAccount = ({ id, name, ...data }) => {
+    const { inputValue } = this.state
+    const { addAccount } = this.props
+
+    addAccount({
+      id,
+      name,
+      type: inputValue.wallet,
+      data,
+    })
+  }
+
   _timeout = undefined
 
   render() {
@@ -315,7 +268,7 @@ class AddAccountModal extends PureComponent<Props, State> {
     return (
       <Modal
         name="add-account"
-        preventBackdropClick={step !== 'createAccount'}
+        preventBackdropClick={step !== 'chooseWallet'}
         onClose={this.handleClose}
         render={({ onClose }) => (
           <ModalBody onClose={onClose} flow={3}>
diff --git a/yarn.lock b/yarn.lock
index 9818d244..e8e5d2ef 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8571,9 +8571,9 @@ style-loader@^0.19.0, style-loader@^0.19.1:
     loader-utils "^1.0.2"
     schema-utils "^0.3.0"
 
-styled-components@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-3.0.2.tgz#dbcd66ee84d444ee4332a7f74027e8a675191593"
+styled-components@^3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-3.1.1.tgz#7896819070b2663c6519f428017d6ca7e2a3c7cd"
   dependencies:
     buffer "^5.0.3"
     css-to-react-native "^2.0.3"
@@ -8582,6 +8582,7 @@ styled-components@^3.0.2:
     is-plain-object "^2.0.1"
     prop-types "^15.5.4"
     stylis "^3.4.0"
+    stylis-rule-sheet "^0.0.7"
     supports-color "^3.2.3"
 
 styled-system@^1.1.1:
@@ -8590,6 +8591,10 @@ styled-system@^1.1.1:
   dependencies:
     prop-types "^15.6.0"
 
+stylis-rule-sheet@^0.0.7:
+  version "0.0.7"
+  resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.7.tgz#5c51dc879141a61821c2094ba91d2cbcf2469c6c"
+
 stylis@^3.4.0:
   version "3.4.8"
   resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.4.8.tgz#94380babbcd4c75726215794ca985b38ec96d1a3"