diff --git a/.changeset/five-cycles-listen/changes.json b/.changeset/five-cycles-listen/changes.json
new file mode 100644
index 000000000..44253a7b4
--- /dev/null
+++ b/.changeset/five-cycles-listen/changes.json
@@ -0,0 +1 @@
+{ "releases": [{ "name": "@emotion/core", "type": "patch" }], "dependents": [] }
diff --git a/.changeset/five-cycles-listen/changes.md b/.changeset/five-cycles-listen/changes.md
new file mode 100644
index 000000000..2ecfc7d37
--- /dev/null
+++ b/.changeset/five-cycles-listen/changes.md
@@ -0,0 +1 @@
+Accept objects as `className` in jsx-created components (they are stringified) to match React behavior
diff --git a/packages/core/__tests__/__snapshots__/legacy-class-name.js.snap b/packages/core/__tests__/__snapshots__/legacy-class-name.js.snap
new file mode 100644
index 000000000..ffe08d061
--- /dev/null
+++ b/packages/core/__tests__/__snapshots__/legacy-class-name.js.snap
@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`object className 1`] = `
+.emotion-0 {
+  color: hotpink;
+}
+
+<div
+  className="legacy__class emotion-0"
+/>
+`;
+
+exports[`string className 1`] = `
+.emotion-0 {
+  color: hotpink;
+}
+
+<div
+  className="legacy__class emotion-0"
+/>
+`;
diff --git a/packages/core/__tests__/legacy-class-name.js b/packages/core/__tests__/legacy-class-name.js
new file mode 100644
index 000000000..5df773493
--- /dev/null
+++ b/packages/core/__tests__/legacy-class-name.js
@@ -0,0 +1,35 @@
+// @flow
+/** @jsx jsx */
+import 'test-utils/next-env'
+import { jsx, css } from '@emotion/core'
+import renderer from 'react-test-renderer'
+
+test('string className', () => {
+  const tree = renderer
+    .create(
+      <div
+        className="legacy__class"
+        css={css`
+          color: hotpink;
+        `}
+      />
+    )
+    .toJSON()
+
+  expect(tree).toMatchSnapshot()
+})
+
+test('object className', () => {
+  const tree = renderer
+    .create(
+      <div
+        className={{ toString: () => 'legacy__class' }}
+        css={css`
+          color: hotpink;
+        `}
+      />
+    )
+    .toJSON()
+
+  expect(tree).toMatchSnapshot()
+})
diff --git a/packages/core/src/jsx.js b/packages/core/src/jsx.js
index 9bcdb323d..8a014f2c6 100644
--- a/packages/core/src/jsx.js
+++ b/packages/core/src/jsx.js
@@ -30,12 +30,14 @@ let render = (cache, props, theme: null | Object, ref) => {
   let registeredStyles = [cssProp]
   let className = ''
 
-  if (props.className !== undefined) {
+  if (typeof props.className === 'string') {
     className = getRegisteredStyles(
       cache.registered,
       registeredStyles,
       props.className
     )
+  } else if (props.className != null) {
+    className = `${props.className} `
   }
 
   let serialized = serializeStyles(registeredStyles)
diff --git a/packages/styled-base/src/index.js b/packages/styled-base/src/index.js
index 23252eeed..1ac85c977 100644
--- a/packages/styled-base/src/index.js
+++ b/packages/styled-base/src/index.js
@@ -100,13 +100,13 @@ let createStyled: CreateStyled = (tag: any, options?: StyledOptions) => {
             }
 
             if (typeof props.className === 'string') {
-              className += getRegisteredStyles(
+              className = getRegisteredStyles(
                 context.registered,
                 classInterpolations,
                 props.className
               )
             } else if (props.className != null) {
-              className += `${props.className} `
+              className = `${props.className} `
             }
 
             const serialized = serializeStyles(