diff --git a/resources/js/Pages/CustomerGroups.tsx b/resources/js/Pages/CustomerGroups.tsx
index 500f238..327b983 100644
--- a/resources/js/Pages/CustomerGroups.tsx
+++ b/resources/js/Pages/CustomerGroups.tsx
@@ -211,7 +211,7 @@ export default function CustomerGroups({groups, customers} :( CustomerGroupProps
                                     .map( customer => {
                                     return <label className='checkbox'>
                                         <input type="checkbox" className='mr-2' data-id={customer.id} onClick={handleCheckBoxChangeAddToGroup}/>
-                                        {customer.name}
+                                        {customer.id}. {customer.name}
                                     </label>
                                 })}
                             </div>
@@ -228,7 +228,7 @@ export default function CustomerGroups({groups, customers} :( CustomerGroupProps
                                     .filter((filteredCustomer) => checkboxesAddToGroup.includes("" + filteredCustomer.id))
                                     .map( customer => {
                                     return  <p key={customer.id} className='mr-2 tag'>
-                                            {customer.name}
+                                            {customer.id}. {customer.name}
                                         </p>
                                     
                                 })}
@@ -281,7 +281,7 @@ export default function CustomerGroups({groups, customers} :( CustomerGroupProps
                                         .map( customer => {
                                         return <label key={customer.id} className='checkbox'>
                                             <input type="checkbox" className='mr-2' data-id={customer.id} onClick={handleCheckBoxChange}/>
-                                            {customer.name}
+                                            {customer.id}. {customer.name}
                                         </label>
                                     })}
                                 </div>
@@ -298,7 +298,7 @@ export default function CustomerGroups({groups, customers} :( CustomerGroupProps
                                         .filter((filteredCustomer) => checkboxes.includes("" + filteredCustomer.id))
                                         .map( customer => {
                                         return  <p key={customer.id} className='mr-2 tag'>
-                                                {customer.name}
+                                                {customer.id}. {customer.name}
                                             </p>
                                         
                                     })}
@@ -354,7 +354,7 @@ export default function CustomerGroups({groups, customers} :( CustomerGroupProps
                                 <ul>
                                     { group.customers.length > 0 && group.customers.filter((customer) => customer.is_in_group).map( customer => {
                                         return <div className='is-flex gap-4 border-b p-2 is-justify-content-space-between'>
-                                                <p className="is-size-5">{customer.name}</p>
+                                                <p className="is-size-5">{customer.id}. {customer.name}</p>
                                                 <button onClick={() => deleteCustomerFromGroup(customer.id)} className="button is-danger is-outlined is-small">
                                                     <span>Ta bort från grupp</span>
                                                 </button>