How to Change the Font size of only the "Column Name" in Sharepoint List settings

Question

How to Change the Font size of only the "Column Name" in Sharepoint List settings

gokhan tastekin 1

I would need to make the font size of "Column Name" bigger than the text or multiple choice criteria font size. I have not been able to identify how to do the change in Microsoft 365 Sharepoint list settings.

I am attaching the snapshots of how the "column name" appears on display mode smaller in font size compared to the Text it represents. The column Name is defined at the list settings edit.

0 comments

1 answer

Your answer

Answer 1

CaseyYang-MSFT 10,466

Hi @gokhan tastekin ,

There is no OOTB way to change the font size of column header. In list settings we can change font size of item by JSON formatting. But to change the font size of column header you have to inject custom CSS code using SPFx Application Extensions as a workaround.

CSS code be like:

.ms-DetailsList-headerWrapper .ms-DetailsHeader-cell{  
	font-size:18px !important;  
}

For Reference: Column Header Size

If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

CaseyYang-MSFT 10,466 Reputation points

2022-02-25T08:07:04.447+00:00

Hi @gokhan tastekin ,

Is there any update on this thread? Comment here if you still need any help.
gokhan tastekin 1 Reputation point

2022-03-03T07:19:52.27+00:00

Hi Casey,

Thank you so much for your solution "you have to inject custom CSS code using SPFx Application Extensions as a workaround."

But as I am not an expert on how to be able to do your above explained process. May I kindly ask for you to provide me in simple terms "step by step" what I need to do.

Thanks a lot
Cheers
Gokhan
CaseyYang-MSFT 10,466 Reputation points

2022-03-07T01:57:06.743+00:00

Hi @gokhan tastekin ,

Here is a article about how to Inject Custom CSS on SharePoint Modern Pages using SPFx Application Extensions step by step. You have to download and deploy SPFx solution package in your tenant’s app catalog.
Note: Microsoft is providing this information as a convenience to you. The sites are not controlled by Microsoft. Microsoft cannot make any representations regarding the quality, safety, or suitability of any software or information found there. Please make sure that you completely understand the risk before retrieving any suggestions from the above link.