diff --git a/README.md b/README.md
index b73023d3..8e287439 100644
--- a/README.md
+++ b/README.md
@@ -53,6 +53,7 @@ Exported modules:
* Components
* [`ActivityIndicator`](docs/components/ActivityIndicator.md)
+ * [`Button`](docs/components/Button.md)
* [`Image`](docs/components/Image.md)
* [`ListView`](docs/components/ListView.md)
* [`ProgressBar`](docs/components/ProgressBar.md)
diff --git a/docs/components/Button.md b/docs/components/Button.md
new file mode 100644
index 00000000..df92c51e
--- /dev/null
+++ b/docs/components/Button.md
@@ -0,0 +1,39 @@
+# Button
+
+A basic button component. Supports a minimal level of customization. You can
+build your own custom button using `TouchableOpacity` or
+`TouchableNativeFeedback`.
+
+## Props
+
+**accessibilityLabel**: string
+
+Defines the text available to assistive technologies upon interaction with the
+element. (This is implemented using `aria-label`.)
+
+**color**: string
+
+Background color of the button.
+
+**disabled**: bool = false
+
+If true, disable all interactions for this component
+
+**onPress**: function
+
+This function is called on press.
+
+**title**: string
+
+Text to display inside the button.
+
+## Examples
+
+```js
+
+```
diff --git a/examples/components/Button/ButtonExample.js b/examples/components/Button/ButtonExample.js
new file mode 100644
index 00000000..2915a452
--- /dev/null
+++ b/examples/components/Button/ButtonExample.js
@@ -0,0 +1,80 @@
+import React from 'react';
+import { action, storiesOf } from '@kadira/storybook';
+import { Button, StyleSheet, View } from 'react-native';
+
+const onButtonPress = action('Button has been pressed!');
+
+const examples = [
+ {
+ title: 'Simple Button',
+ description: 'The title and onPress handler are required. It is ' +
+ 'recommended to set accessibilityLabel to help make your app usable by ' +
+ 'everyone.',
+ render: function() {
+ return (
+
+ );
+ },
+ },
+ {
+ title: 'Adjusted color',
+ description: 'Adjusts the color in a way that looks standard on each ' +
+ 'platform. On iOS, the color prop controls the color of the text. On ' +
+ 'Android, the color adjusts the background color of the button.',
+ render: function() {
+ return (
+
+ );
+ },
+ },
+ {
+ title: 'Fit to text layout',
+ description: 'This layout strategy lets the title define the width of ' +
+ 'the button',
+ render: function() {
+ return (
+
+
+
+
+ );
+ },
+ },
+ {
+ title: 'Disabled Button',
+ description: 'All interactions for the component are disabled.',
+ render: function() {
+ return (
+
+ );
+ },
+ },
+];
+
+examples.forEach((example) => {
+ storiesOf('component: Button', module)
+ .add(example.title, () => example.render());
+});
diff --git a/src/components/Button/__tests__/index-test.js b/src/components/Button/__tests__/index-test.js
new file mode 100644
index 00000000..a7590e07
--- /dev/null
+++ b/src/components/Button/__tests__/index-test.js
@@ -0,0 +1,5 @@
+/* eslint-env jasmine, jest */
+
+describe('components/Button', () => {
+ test.skip('NO TEST COVERAGE', () => {});
+});
diff --git a/src/components/Button/index.js b/src/components/Button/index.js
new file mode 100644
index 00000000..3c03b3de
--- /dev/null
+++ b/src/components/Button/index.js
@@ -0,0 +1,66 @@
+import ColorPropType from '../../propTypes/ColorPropType';
+import React, { Component, PropTypes } from 'react';
+import StyleSheet from '../../apis/StyleSheet';
+import TouchableOpacity from '../Touchable/TouchableOpacity';
+import Text from '../Text';
+
+class Button extends Component {
+ static propTypes = {
+ accessibilityLabel: PropTypes.string,
+ color: ColorPropType,
+ disabled: PropTypes.bool,
+ onPress: PropTypes.func.isRequired,
+ title: PropTypes.string.isRequired
+ };
+
+ render() {
+ const {
+ accessibilityLabel,
+ color,
+ disabled,
+ onPress,
+ title
+ } = this.props;
+
+ return (
+
+
+ {title}
+
+
+ );
+ }
+}
+
+const styles = StyleSheet.create({
+ button: {
+ backgroundColor: '#2196F3',
+ borderRadius: 2
+ },
+ text: {
+ textAlign: 'center',
+ color: '#fff',
+ padding: 8,
+ fontWeight: '500'
+ },
+ buttonDisabled: {
+ backgroundColor: '#dfdfdf'
+ },
+ textDisabled: {
+ color: '#a1a1a1'
+ }
+});
+
+module.exports = Button;
diff --git a/src/index.js b/src/index.js
index 3a2d79e1..94787f4b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -24,6 +24,7 @@ import Vibration from './apis/Vibration';
// components
import ActivityIndicator from './components/ActivityIndicator';
+import Button from './components/Button';
import Image from './components/Image';
import ListView from './components/ListView';
import ProgressBar from './components/ProgressBar';
@@ -72,6 +73,7 @@ const ReactNative = {
// components
ActivityIndicator,
+ Button,
Image,
ListView,
ProgressBar,