diff --git a/story/buttons.stories.js b/story/buttons.stories.js
index 5d8e859..8211f1e 100644
--- a/story/buttons.stories.js
+++ b/story/buttons.stories.js
@@ -1,12 +1,16 @@
 import { storiesOf } from '@storybook/html'; // eslint-disable-line import/no-extraneous-dependencies
 import { // eslint-disable-line import/no-extraneous-dependencies
-  withKnobs, radios,
+  withKnobs, radios, select,
 } from '@storybook/addon-knobs';
 
 const stories = storiesOf('Buttons', module);
 stories.addDecorator(withKnobs);
 
 stories.add('button', () => {
+  const buttonType = select('type', {
+    button: 'button',
+    file: 'file',
+  }, 'button');
   const extraClass = radios('class', {
     default: '',
     'is-primary': 'is-primary',
@@ -15,5 +19,10 @@ stories.add('button', () => {
     'is-error': 'is-error',
     'is-disabled': 'is-disabled',
   }, '');
-  return `<button type="button" class="nes-btn ${extraClass}">Normal</button>`;
+  return buttonType === 'file'
+    ? `<label class="nes-btn ${extraClass}">
+      <span>Select your file</span>
+      <input type="file">
+    </label>`
+    : `<button type="button" class="nes-btn ${extraClass}">Normal</button>`;
 });