diff --git a/__tests__/components/__snapshots__/modal.test.jsx.snap b/__tests__/components/__snapshots__/modal.test.jsx.snap
index 93d5bf2f4..515d5c209 100644
--- a/__tests__/components/__snapshots__/modal.test.jsx.snap
+++ b/__tests__/components/__snapshots__/modal.test.jsx.snap
@@ -179,7 +179,9 @@ exports[`Modal Component renders whole form after header clicked 1`] = `
             className="flex items-center justify-center"
           >
             <button
-              className=" rounded px-4 py-2 text-white bg-green-700"
+              className="rounded px-4 py-2 text-white bg-gray-400 cursor-not-allowed"
+              disabled={true}
+              title="Please select a certification."
               type="submit"
             >
               Create
diff --git a/components/modal.js b/components/modal.js
index 3925c0cc7..b93c55997 100644
--- a/components/modal.js
+++ b/components/modal.js
@@ -150,7 +150,13 @@ export default function Modal({
                     <div className='flex items-center justify-center'>
                       <button
                         type='submit'
-                        className=' rounded px-4 py-2 text-white bg-green-700'
+                        disabled={selected.length === 0}
+                        title={selected.length === 0 ? 'Please select a certification.' : ''}
+                        className={`rounded px-4 py-2 text-white ${
+                          selected.length === 0
+                            ? 'bg-gray-400 cursor-not-allowed'
+                            : 'bg-green-700 hover:bg-green-800'
+                        }`}
                       >
                         Create
                       </button>