diff --git a/common/changes/office-ui-fabric-react/searchbox-focus_2018-04-17-18-23.json b/common/changes/office-ui-fabric-react/searchbox-focus_2018-04-17-18-23.json
new file mode 100644
index 0000000000000..630155d1bcf41
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchbox-focus_2018-04-17-18-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Clicks on element before input field set cursor to start of input text.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 24597119e0b0f..9d9f72145e704 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -82,8 +82,14 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
         className={ classNames.root }
         onFocusCapture={ this._onFocusCapture }
       >
-        <div className={ classNames.iconContainer }>
-          <Icon className={ classNames.icon } iconName='Search' />
+        <div
+          className={ classNames.iconContainer }
+          onClick={ this._onClickFocus }
+        >
+          <Icon
+            className={ classNames.icon }
+            iconName='Search'
+          />
         </div>
         <input
           id={ id }
@@ -142,6 +148,14 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     }
   }
 
+  private _onClickFocus = () => {
+    const inputElement = this._inputElement.value;
+    if (inputElement) {
+      this.focus();
+      inputElement.selectionStart = inputElement.selectionEnd = 0;
+    }
+  }
+
   private _onFocusCapture = (ev: React.FocusEvent<HTMLElement>) => {
     this.setState({
       hasFocus: true
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
index 17028bade5a3e..280b9d65b7eb2 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -84,7 +84,8 @@ export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
         width: 32,
         textAlign: 'center',
         transition: `width ${AnimationVariables.durationValue1}`,
-        color: palette.themePrimary
+        color: palette.themePrimary,
+        cursor: 'text'
       },
       hasFocus && {
         width: 4,
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index ea8c6904b138f..dc8155cc4fdea 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -44,6 +44,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
         ms-SearchBox-iconContainer
         {
           color: #0078d4;
+          cursor: text;
           display: flex;
           flex-direction: column;
           flex-shrink: 0;
@@ -53,6 +54,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
           transition: width 0.167s;
           width: 32px;
         }
+    onClick={[Function]}
   >
     <i
       aria-hidden={true}