diff --git a/extensions/sql-database-projects/src/common/constants.ts b/extensions/sql-database-projects/src/common/constants.ts
index 832b6111dd..67569f8021 100644
--- a/extensions/sql-database-projects/src/common/constants.ts
+++ b/extensions/sql-database-projects/src/common/constants.ts
@@ -122,7 +122,7 @@ export const databaseProject = localize('databaseProject', "Database project");
 
 // Create Project From Database dialog strings
 
-export const createProjectFromDatabaseDialogName = localize('createProjectFromDatabaseDialogName', "Create Project From Database");
+export const createProjectFromDatabaseDialogName = localize('createProjectFromDatabaseDialogName', "Create project from database");
 export const createProjectDialogOkButtonText = localize('createProjectDialogOkButtonText', "Create");
 export const sourceDatabase = localize('sourceDatabase', "Source database");
 export const targetProject = localize('targetProject', "Target project");
@@ -130,7 +130,7 @@ export const createProjectSettings = localize('createProjectSettings', "Settings
 export const projectNameLabel = localize('projectNameLabel', "Name");
 export const projectNamePlaceholderText = localize('projectNamePlaceholderText', "Enter project name");
 export const projectLocationLabel = localize('projectLocationLabel', "Location");
-export const projectLocationPlaceholderText = localize('projectLocationPlaceholderText', "Enter project location");
+export const projectLocationPlaceholderText = localize('projectLocationPlaceholderText', "Select location to create project");
 export const browseButtonText = localize('browseButtonText', "Browse folder");
 export const folderStructureLabel = localize('folderStructureLabel', "Folder structure");
 
diff --git a/extensions/sql-database-projects/src/common/uiConstants.ts b/extensions/sql-database-projects/src/common/uiConstants.ts
index 98cf95283e..e70bc8ee0a 100644
--- a/extensions/sql-database-projects/src/common/uiConstants.ts
+++ b/extensions/sql-database-projects/src/common/uiConstants.ts
@@ -11,12 +11,15 @@ export namespace cssStyles {
 	export const fontWeightBold = { 'font-weight': 'bold' };
 	export const titleFontSize = 13;
 
-	export const labelWidth = '205px';
-	export const textboxWidth = '190px';
+	export const publishDialogLabelWidth = '205px';
+	export const publishDialogTextboxWidth = '190px';
 
 	export const addDatabaseReferenceDialogLabelWidth = '215px';
 	export const addDatabaseReferenceInputboxWidth = '220px';
 
+	export const createProjectFromDatabaseLabelWidth = '110px';
+	export const createProjectFromDatabaseTextboxWidth = '320px';
+
 	// font-styles
 	export namespace fontStyle {
 		export const normal = 'normal';
diff --git a/extensions/sql-database-projects/src/dialogs/createProjectFromDatabaseDialog.ts b/extensions/sql-database-projects/src/dialogs/createProjectFromDatabaseDialog.ts
index 5aa158d260..83aa78546d 100644
--- a/extensions/sql-database-projects/src/dialogs/createProjectFromDatabaseDialog.ts
+++ b/extensions/sql-database-projects/src/dialogs/createProjectFromDatabaseDialog.ts
@@ -112,7 +112,8 @@ export class CreateProjectFromDatabaseDialog {
 					titleFontSize: cssStyles.titleFontSize
 				})
 				.withLayout({
-					width: '100%'
+					width: '100%',
+					padding: '10px 10px 0 20px'
 				});
 
 			let formModel = this.formBuilder.component();
@@ -129,12 +130,11 @@ export class CreateProjectFromDatabaseDialog {
 		const serverLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.server,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth,
-			CSSStyles: cssStyles.fontWeightBold
+			width: cssStyles.createProjectFromDatabaseLabelWidth
 		}).component();
 
-		const connectionRow = view.modelBuilder.flexContainer().withItems([serverLabel, sourceConnectionTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-bottom': '-10px', 'margin-top': '-20px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
-		connectionRow.insertItem(selectConnectionButton, 2, { CSSStyles: { 'margin-right': '0px', 'margin-bottom': '-10px', 'margin-top': '-20px' } });
+		const connectionRow = view.modelBuilder.flexContainer().withItems([serverLabel, sourceConnectionTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-bottom': '-5px', 'margin-top': '-10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
+		connectionRow.insertItem(selectConnectionButton, 2, { CSSStyles: { 'margin-right': '0px', 'margin-bottom': '-5px', 'margin-top': '-10px' } });
 
 		return connectionRow;
 	}
@@ -143,7 +143,7 @@ export class CreateProjectFromDatabaseDialog {
 		this.sourceDatabaseDropDown = view.modelBuilder.dropDown().withProperties({
 			ariaLabel: constants.databaseNameLabel,
 			required: true,
-			width: cssStyles.textboxWidth,
+			width: cssStyles.createProjectFromDatabaseTextboxWidth,
 			editable: true,
 			fireOnTextChange: true
 		}).component();
@@ -156,8 +156,7 @@ export class CreateProjectFromDatabaseDialog {
 		const databaseLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.databaseNameLabel,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth,
-			CSSStyles: cssStyles.fontWeightBold
+			width: cssStyles.createProjectFromDatabaseLabelWidth
 		}).component();
 
 		const databaseRow = view.modelBuilder.flexContainer().withItems([databaseLabel, <azdata.DropDownComponent>this.sourceDatabaseDropDown], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-bottom': '-10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -173,7 +172,7 @@ export class CreateProjectFromDatabaseDialog {
 		this.sourceConnectionTextBox = view.modelBuilder.inputBox().withProperties({
 			value: '',
 			placeHolder: constants.selectConnection,
-			width: cssStyles.textboxWidth,
+			width: cssStyles.createProjectFromDatabaseTextboxWidth,
 			enabled: false
 		}).component();
 
@@ -229,8 +228,9 @@ export class CreateProjectFromDatabaseDialog {
 	private createProjectNameRow(view: azdata.ModelView): azdata.FlexContainer {
 		this.projectNameTextBox = view.modelBuilder.inputBox().withProperties<azdata.InputBoxProperties>({
 			ariaLabel: constants.projectNamePlaceholderText,
+			placeHolder: constants.projectNamePlaceholderText,
 			required: true,
-			width: cssStyles.textboxWidth,
+			width: cssStyles.createProjectFromDatabaseTextboxWidth,
 			validationErrorMessage: constants.projectNameRequired
 		}).component();
 
@@ -242,11 +242,10 @@ export class CreateProjectFromDatabaseDialog {
 		const projectNameLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.projectNameLabel,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth,
-			CSSStyles: cssStyles.fontWeightBold
+			width: cssStyles.createProjectFromDatabaseLabelWidth
 		}).component();
 
-		const projectNameRow = view.modelBuilder.flexContainer().withItems([projectNameLabel, this.projectNameTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-bottom': '-10px', 'margin-top': '-20px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
+		const projectNameRow = view.modelBuilder.flexContainer().withItems([projectNameLabel, this.projectNameTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-bottom': '-5px', 'margin-top': '-10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
 
 		return projectNameRow;
 	}
@@ -258,7 +257,7 @@ export class CreateProjectFromDatabaseDialog {
 			value: '',
 			ariaLabel: constants.projectLocationLabel,
 			placeHolder: constants.projectLocationPlaceholderText,
-			width: cssStyles.textboxWidth,
+			width: cssStyles.createProjectFromDatabaseTextboxWidth,
 			validationErrorMessage: constants.projectLocationRequired
 		}).component();
 
@@ -270,8 +269,7 @@ export class CreateProjectFromDatabaseDialog {
 		const projectLocationLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.projectLocationLabel,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth,
-			CSSStyles: cssStyles.fontWeightBold
+			width: cssStyles.createProjectFromDatabaseLabelWidth
 		}).component();
 
 		const projectLocationRow = view.modelBuilder.flexContainer().withItems([projectLocationLabel, this.projectLocationTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-bottom': '-10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -313,7 +311,7 @@ export class CreateProjectFromDatabaseDialog {
 			value: constants.schemaObjectType,
 			ariaLabel: constants.folderStructureLabel,
 			required: true,
-			width: cssStyles.textboxWidth
+			width: cssStyles.createProjectFromDatabaseTextboxWidth
 		}).component();
 
 		this.folderStructureDropDown.onValueChanged(() => {
@@ -323,11 +321,10 @@ export class CreateProjectFromDatabaseDialog {
 		const folderStructureLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.folderStructureLabel,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth,
-			CSSStyles: cssStyles.fontWeightBold
+			width: cssStyles.createProjectFromDatabaseLabelWidth
 		}).component();
 
-		const folderStructureRow = view.modelBuilder.flexContainer().withItems([folderStructureLabel, <azdata.DropDownComponent>this.folderStructureDropDown], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-top': '-20px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
+		const folderStructureRow = view.modelBuilder.flexContainer().withItems([folderStructureLabel, <azdata.DropDownComponent>this.folderStructureDropDown], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px', 'margin-top': '-10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
 
 		return folderStructureRow;
 	}
diff --git a/extensions/sql-database-projects/src/dialogs/publishDatabaseDialog.ts b/extensions/sql-database-projects/src/dialogs/publishDatabaseDialog.ts
index e3f2d852e3..bc4eba0a3b 100644
--- a/extensions/sql-database-projects/src/dialogs/publishDatabaseDialog.ts
+++ b/extensions/sql-database-projects/src/dialogs/publishDatabaseDialog.ts
@@ -289,7 +289,7 @@ export class PublishDatabaseDialog {
 			value: '',
 			ariaLabel: constants.targetConnectionLabel,
 			placeHolder: constants.selectConnection,
-			width: cssStyles.textboxWidth,
+			width: cssStyles.publishDialogTextboxWidth,
 			enabled: false
 		}).component();
 
@@ -353,12 +353,12 @@ export class PublishDatabaseDialog {
 		this.loadProfileTextBox = view.modelBuilder.inputBox().withProperties({
 			placeHolder: constants.loadProfilePlaceholderText,
 			ariaLabel: constants.profile,
-			width: cssStyles.textboxWidth
+			width: cssStyles.publishDialogTextboxWidth
 		}).component();
 
 		const profileLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.profile,
-			width: cssStyles.labelWidth
+			width: cssStyles.publishDialogLabelWidth
 		}).component();
 
 		const profileRow = view.modelBuilder.flexContainer().withItems([profileLabel, this.loadProfileTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -374,7 +374,7 @@ export class PublishDatabaseDialog {
 		const serverLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.server,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth
+			width: cssStyles.publishDialogLabelWidth
 		}).component();
 
 		const connectionRow = view.modelBuilder.flexContainer().withItems([serverLabel, this.targetConnectionTextBox], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();
@@ -389,7 +389,7 @@ export class PublishDatabaseDialog {
 			value: this.getDefaultDatabaseName(),
 			ariaLabel: constants.databaseNameLabel,
 			required: true,
-			width: cssStyles.textboxWidth,
+			width: cssStyles.publishDialogTextboxWidth,
 			editable: true,
 			fireOnTextChange: true
 		}).component();
@@ -401,7 +401,7 @@ export class PublishDatabaseDialog {
 		const databaseLabel = view.modelBuilder.text().withProperties<azdata.TextComponentProperties>({
 			value: constants.databaseNameLabel,
 			requiredIndicator: true,
-			width: cssStyles.labelWidth
+			width: cssStyles.publishDialogLabelWidth
 		}).component();
 
 		const databaseRow = view.modelBuilder.flexContainer().withItems([databaseLabel, <azdata.DropDownComponent>this.targetDatabaseDropDown], { flex: '0 0 auto', CSSStyles: { 'margin-right': '10px' } }).withLayout({ flexFlow: 'row', alignItems: 'center' }).component();