diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
index fb8e95eff6..88e6caaa12 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/controller-service.css
@@ -228,7 +228,7 @@ div.disable-referencing-components, div.enable-referencing-components {
     New inline controller service dialog
 */
 
-div.new-inline-controller-service-requirement, div.new-inline-controller-service-combo, div.new-inline-controller-service-bundle, div.new-inline-controller-service-tags {
+div.new-inline-controller-service-requirement, div.new-inline-controller-service-combo, div.new-inline-controller-service-bundle, div.new-inline-controller-service-tags, div.new-inline-controller-service-description {
     margin-bottom: 15px;
 }
 
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js
index 7c27b3d03a..be9627154e 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/jquery/propertytable/jquery.propertytable.js
@@ -1014,6 +1014,12 @@
                                     '<div class="new-inline-controller-service-description"></div>' +
                                 '</div>' +
                             '</div>' +
+                            '<div>' +
+                                '<div class="setting-name">Controller Service Name</div>' +
+                                '<div class="setting-field">' +
+                                    '<input type="text" class="new-inline-controller-service-name"/>' +
+                                '</div>' +
+                            '</div>' +
                         '</div>' +
                     '</div>';
 
@@ -1023,6 +1029,7 @@
                 var newControllerServiceBundle = newControllerServiceDialog.find('div.new-inline-controller-service-bundle');
                 var newControllerServiceTags = newControllerServiceDialog.find('div.new-inline-controller-service-tags');
                 var newControllerServiceDescription = newControllerServiceDialog.find('div.new-inline-controller-service-description');
+                var newControllerServiceNameInput = newControllerServiceDialog.find('input.new-inline-controller-service-name');
 
                 // include the required service
                 var formattedType = nfCommon.formatType({
@@ -1089,6 +1096,7 @@
                 var create = function () {
                     var newControllerServiceKey = newControllerServiceCombo.combo('getSelectedOption').value;
                     var newControllerServiceType = controllerServiceLookup.get(newControllerServiceKey);
+                    var newControllerServiceName = newControllerServiceNameInput.val();
 
                     // build the controller service entity
                     var controllerServiceEntity = {
@@ -1103,6 +1111,11 @@
                         }
                     };
 
+                    // set custom name when specified
+                    if (newControllerServiceName.trim() !== '') {
+                        controllerServiceEntity.component.name = newControllerServiceName.trim();
+                    }
+
                     // determine the appropriate uri for creating the controller service
                     var uri = '../nifi-api/controller/controller-services';
                     if (nfCommon.isDefinedAndNotNull(groupId)) {