diff --git a/packages/block-library/src/quote/editor.scss b/packages/block-library/src/quote/editor.scss
index 3826e0a998b3e8..d0cad8e00a0a28 100644
--- a/packages/block-library/src/quote/editor.scss
+++ b/packages/block-library/src/quote/editor.scss
@@ -1,7 +1,47 @@
 .wp-block-quote {
-	margin: 0;
+	margin: 0 inherit;
 
 	&__citation {
 		font-size: $default-font-size;
-	}
-}
+	} // &__citation
+
+	&.is-left {
+		border-left: 4px solid $black;
+		padding-left: 1em;
+	} // &.is-left
+
+	&.is-right {
+		border-right: 4px solid $black;
+		padding-right: 1em;
+		text-align: right;
+	} // &.is-right
+
+	&.is-center {
+		margin: 3em inherit;
+		padding-left: 2em;
+		padding-right: 2em;
+		text-align: center;
+
+		&::before {
+			background-color: $black;
+			content: "";
+			display: block;
+			height: 4px;
+			margin-left: calc(50% - 10%);
+			margin-bottom: 2em;
+			width: 20%;
+		} // &::before
+
+		&::after {
+			background-color: $black;
+			content: "";
+			display: block;
+			height: 4px;
+			margin-left: calc(50% - 10%);
+			margin-top: 2em;
+			width: 20%;
+		} // &::after
+
+	} // .is-center
+
+} // .wp-block-quote
diff --git a/packages/block-library/src/quote/index.js b/packages/block-library/src/quote/index.js
index 67cf5cc67692a0..928585b9e01dfa 100644
--- a/packages/block-library/src/quote/index.js
+++ b/packages/block-library/src/quote/index.js
@@ -2,6 +2,7 @@
  * External dependencies
  */
 import { omit } from 'lodash';
+import classnames from 'classnames';
 
 /**
  * WordPress dependencies
@@ -33,6 +34,7 @@ const blockAttributes = {
 	},
 	align: {
 		type: 'string',
+		default: 'is-left',
 	},
 };
 
@@ -189,17 +191,23 @@ export const settings = {
 
 	edit( { attributes, setAttributes, isSelected, mergeBlocks, onReplace, className } ) {
 		const { align, value, citation } = attributes;
+
+		const classes = classnames(
+			className,
+			align,
+		);
+
 		return (
 			<Fragment>
 				<BlockControls>
 					<AlignmentToolbar
 						value={ align }
 						onChange={ ( nextAlign ) => {
-							setAttributes( { align: nextAlign } );
+							setAttributes( { align: 'is-' + nextAlign } );
 						} }
 					/>
 				</BlockControls>
-				<blockquote className={ className } style={ { textAlign: align } }>
+				<blockquote className={ classes }>
 					<RichText
 						multiline
 						value={ value }
@@ -240,11 +248,16 @@ export const settings = {
 		);
 	},
 
-	save( { attributes } ) {
+	save( { attributes, className } ) {
 		const { align, value, citation } = attributes;
 
+		const classes = classnames(
+			className,
+			align,
+		);
+
 		return (
-			<blockquote style={ { textAlign: align ? align : null } }>
+			<blockquote className={ classes }>
 				<RichText.Content multiline value={ value } />
 				{ ! RichText.isEmpty( citation ) && <RichText.Content tagName="cite" value={ citation } /> }
 			</blockquote>
diff --git a/packages/block-library/src/quote/style.scss b/packages/block-library/src/quote/style.scss
index c1206d68958f7b..d34c99271fa7fe 100644
--- a/packages/block-library/src/quote/style.scss
+++ b/packages/block-library/src/quote/style.scss
@@ -1,19 +1,19 @@
 .wp-block-quote {
+
 	&.is-style-large,
 	&.is-large {
-		margin: 0 0 16px;
-		padding: 0 1em;
 
 		p {
-			font-size: 24px;
+			font-size: 1.33em;
 			font-style: italic;
 			line-height: 1.6;
-		}
+		} // p
 
 		cite,
 		footer {
-			font-size: 18px;
-			text-align: right;
-		}
-	}
-}
+			font-size: 1em;
+		} // cite, footer
+
+	} // &.is-style-large, &.is-large
+
+} // .wp-block-quote
diff --git a/packages/block-library/src/quote/theme.scss b/packages/block-library/src/quote/theme.scss
index 8fbe1ef7b3b210..5f2a8eaa1fb042 100644
--- a/packages/block-library/src/quote/theme.scss
+++ b/packages/block-library/src/quote/theme.scss
@@ -1,5 +1,5 @@
 .wp-block-quote {
-	margin: 20px 0;
+	margin: 1em inherit;
 
 	cite,
 	footer,
@@ -9,10 +9,45 @@
 		margin-top: 1em;
 		position: relative;
 		font-style: normal;
-	}
-}
+	} // cite, footer, &__citation
 
-.wp-block-quote:not(.is-large):not(.is-style-large) {
-	border-left: 4px solid $black;
-	padding-left: 1em;
-}
+	&.is-left {
+		border-left: 4px solid $black;
+		padding-left: 1em;
+	} // &.is-left
+
+	&.is-right {
+		border-right: 4px solid $black;
+		padding-right: 1em;
+		text-align: right;
+	} // &.is-right
+
+	&.is-center {
+		margin: 3em inherit;
+		padding-left: 2em;
+		padding-right: 2em;
+		text-align: center;
+
+		&::before {
+			background-color: $black;
+			content: "";
+			display: block;
+			height: 4px;
+			margin-left: calc(50% - 10%);
+			margin-bottom: 2em;
+			width: 20%;
+		} // &::before
+
+		&::after {
+			background-color: $black;
+			content: "";
+			display: block;
+			height: 4px;
+			margin-left: calc(50% - 10%);
+			margin-top: 2em;
+			width: 20%;
+		} // &::after
+
+	} // .is-center
+
+} // .wp-block-quote