What fonts are you using?
I would also like to know about the fonts, color scheme and organizational structure.
@Outis @Liong1976 the fonts are all from appleās ui kit.
All mode headings: SF Pro Rounded
Edit body: SF Pro Medium
Publish body: New York Medium
I also tinkered with the font sizing to make things a bit more readable on my small MacBook Air.
Hereās the code for the parts you asked about.
--base-h:0;
--base-s:0%;
--base-d:16%; /* Base lightness Dark Mode - 0 is black */
--base-l:97%; /* Base lightness Light Mode - 100 is white */
--accent-h:201;
--accent-s:17%;
--accent-d:60%; /* Accent lightness Dark Mode */
--accent-l:50%; /* Accent lightness Light Mode */
--text: 'New York Small',serif;
--text-editor: 'SF Pro Rounded',serif;
--font-monospace: 'SF Mono',monospace;
--font-ui: 'SF Pro Rounded',sans-serif;
--font-normal: 1.25rem;
--h1: 1.802em;
--h2: 1.602em;
--h3: 1.424em;
--h4: 1.266em;
--h5: 1.125em;
--h6: 1em;
/* --font-outline: 0.889em;
--font-x: 0.79em;
--font-xx: 0.702em; */
--font-small: 0.624em;
--font-smaller: 0.555em;
--font-smallest: 0.493em;
--normal-weight: 350;
--bold-weight: 800;
--line-width: 960px;
--line-height: 1.588;
--max-width: 90%;
--nested-padding: 3.5%;
--icon-muted: 0.4;
--border-width: 1px;
--border-width-alt: 1px;
Thank you, this is very helpful.
Thanks,
Can I install those fonts on WIndows, because I am not a Mac user?
Yep. You should be able to download them from the link I provided and install as you normally would.
Great, thanks!
I had downloaded the fonts but they are .dmg files. I have no idea how to install them in Windows. As far as I know, Windows only can take .ttf files for fonts.
Any idea?
Open it up with 7zip, there is a .pkg file in that, open it with 7zip too > Payload > . > Library > Fonts, extract the otfs. Right click all files and install. Change the CSS and you are good.
No worries, we are all helping each other out.
If you want to copy it exactly, just go to .obsidian/snippets. Make a new text file, letās say minimal_brapstallion_edit.css
Now, copy paste the part from above in it.
Go to Obsidian > Settings > Apperance > select the snippet and you are done.
Thanks, @Outis. I appreciate your help.
I had done what you said, but I did not see the change after activating the snippet.
Do I need to modify this code?
Add something e.g., { }?
Even I am not sure then. I did not need to copy-paste it exactly. I just needed some parts of it rather than the whole.
I am also a CSS noob. I apologize for wasting your time. If you are need for an urgent answer, Obsidian Discord server is a good place. They have a dedicated CSS channel.
How did you take screenshots with shadow and background?
Iām not sure how @Ehsan did it, but you can do the same thing with a white desktop background on a Mac. macOS will do the shadows for you.
cries in Windows
If you donāt want to use a white background, you can do cmd + shift + 4
and press space
and select the application you want to screenshot. You will still get shadows in the background.