✨Discover storytelling in the AI age with Pixar's Matthew Luhn at Sanity Connect, May 8th—register now

How to increase the size of the container and add custom CSS in Sanity Studio.

3 replies
Last updated: Feb 15, 2024
Hi all.Recently updated to the latest version of the studio (from 3.19 to 3.27.1) and my custom logo in the top left has gone.

Now fixed it using the
icon
as mentioned here .
Is it possible to increase the size of the container?

Hate to be my own annoying client and demand
I make the logo bigger but it is a legitimate use case this time 😅
and/or write some custom css to target that section?
Feb 8, 2024, 5:05 PM
Great news: you can inject custom CSS into the Studio. Back news is that it isn’t documented and I’m not sure where you’d begin. I do know that it might not be pretty 😅
Feb 8, 2024, 6:05 PM
Great! I guess I’ll go and not read up on it then :lolsob:
Feb 9, 2024, 10:11 AM
I also ran into this issue, injecting css can be done by importing the css file at the top of your Sanity config:

https://stackoverflow.com/questions/76429882/how-to-import-custom-css-in-sanity-studio-v3
Using an SVG as the Icon you can then create a target and resize as needed. Not pretty
😂 ☝️ but it works!

div:has(> #studio-logo) {
  width: [someValue];
}
Feb 15, 2024, 7:49 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?