Custom CSS

Is your feature request related to a problem? Please describe.

As pretty as Anytype looks, users might prefer different font/element sizes, margin/paddings, colors etc.

Describe the solution you’d like

Have a Custom CSS code Object/Block, which users can add to (overriding any style).

Describe alternatives you’ve considered

Ideally it should be possible to edit the CSS directly in Anytype, seeing changes in real-time.

If not possible, at least have a folder where user can place their .css files.

There are already seperate request for:

[Font Styles](Add options to change font size and style)

[Accent Color](Accent color options)

but a custom CSS option should be much more powerful for advanced users

https://community.anytype.io/t/-/1091

This one together with the one lynxlove mentioned could all work via css as well. For regular users just have a nice UI to change font height and font style and in the background change the CSS. And the power user does have access to all the CSS settings.

I second this - a very big advantage of ObsidianMD is the ability for users to make custom themes and CSS snippets that can also be exchanged. A custom CSS option would make it possible for CSS-proficient users to generate different styles and non-proficient users to apply styles provided by others.

Custom CSS should be nice, for example, I want the top of page icon to align with the top of the first UI block on left panel (kinda remove the empty space above the page icon), but there’s no such settings.

Agreed–as someone who currently uses Notion, experimented with Obsidian, and found Anytype (yesterday!) to be a wonderful mix between the two with additional great features, this level of customization was the other of two missing features that I’d love to see added for my own personal taste.

It’s impossible to build one single style that everybody prefers, and since the underlying app is already relying on CSS for layout and styling, giving users this ability seems like an uncomplicated way to allow a great deal of creative freedom.

Plus 1! (Out of votes…) This would be great for when we can publish pages to multiplayer mode. We can make fully custom pages that match our branding for our Web3 App on Anytype.

Please please please

provide a custom css file so that you can define your own background and colors.
That would be really fantastic and quick to implement.

A customization of the UI in the preferences is very desirable for later. For all those who can not or do not want to deal with CSS.

but you basically can do it by changing color scheme in https://github.com/anyproto/anytype-ts/blob/main/src/scss/_vars.scss

or by overriding anything you like the same way it’s done in dark theme https://github.com/anyproto/anytype-ts/tree/main/src/scss/theme/dark

Yes, thank you. I’ve already seen that. But I don’t want to go that deep. A simple custom.css that is outside the application would be enough for now.

There is hardly any danger of it being overwritten by the many updates.

This works wonderfully with Obsidian.

Outside means that it resides in a data folder, like a plugin?

It means as an example as solved in Obsidian.
In the prefs. you can specify the path to a self-created CSS snippet. Even several if you want.
The path and the snippet are not affected by any application update.

It is empty and unused by default.
But if you can, you can easily create and use your own CSS files here.

I see, interesting

I definitely would LOVE to reduce left margins on sub blocks
And horizontal margins on blocks that are inline….

With a custom css or with a simpler setting approach.

It’s really good, especially for those none-English users.

The aesthetic feeling of characters in each country are quite different.

Thank you, @Razor!

So it seems this is underway now. Just wonderful…

:heart:

Good news!

What’s planned for the 1st version?
A global Custom CSS?
Or a Custom CSS per object?

In my case, it’s often a page I need to customize, so that’s what I voted for.
Having a built-in “Custom CSS” relationship to integrate my CSS into a page would solve so many problems! Even more so when web sharing comes along.

(But I wouldn’t mind a global version, it’ll probably be quite useful already).

Only global for now, but Idea to customize a page is interesting, @y0ur1