# Change CSS for markdown files in DT3?

**URL:** <https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497>\
**Category:** Tips\
**Created:** [May 7, 2020, 9:52pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497 "2020-05-07T21:52:36Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![ptc97504](https://discourse.devontechnologies.com/letter_avatar_proxy/v4/letter/p/2bfe46/32.png) [@ptc97504](https://discourse.devontechnologies.com/u/ptc97504)\
**Post date:** [May 7, 2020, 9:52pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/1 "2020-05-07T21:52:36Z")

</div>

I have tried to follow all the directions in DevonThink to change the Markdown CSS file, to no avail.

Is there some guidance that I’m missing? Every time I add a new .css file in Preferences it seems to be ignored …

---

<div class="post-metadata">

**Author:** ![BLUEFROG](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/bluefrog/32/135_2.png) [@BLUEFROG](https://discourse.devontechnologies.com/u/BLUEFROG)\
**Post date:** [May 7, 2020, 10:34pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/2 "2020-05-07T22:34:03Z")

</div>

Is it applied after quitting and relaunching DEVONthink?

---

<div class="post-metadata">

**Author:** ![ptc97504](https://discourse.devontechnologies.com/letter_avatar_proxy/v4/letter/p/2bfe46/32.png) [@ptc97504](https://discourse.devontechnologies.com/u/ptc97504)\
**Post date:** [May 8, 2020, 5:57am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/3 "2020-05-08T05:57:03Z")

</div>

Yes, I have quit and restarted DEVONthink.

I add the .css files to my Downloads folder and then select them in DT3 Preferences.

---

<div class="post-metadata">

**Author:** ![cgrunenberg](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/cgrunenberg/32/7172_2.png) [@cgrunenberg](https://discourse.devontechnologies.com/u/cgrunenberg)\
**Post date:** [May 11, 2020, 7:33am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/4 "2020-05-11T07:33:25Z")

</div>

Could you please post the CSS file and a sample document not working as expected? Thanks.

---

<div class="post-metadata">

**Author:** ![Grantst](https://discourse.devontechnologies.com/letter_avatar_proxy/v4/letter/g/5f9b8f/32.png) [@Grantst](https://discourse.devontechnologies.com/u/Grantst)\
**Post date:** [February 15, 2021, 11:25pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/5 "2021-02-15T23:25:26Z")

</div>

Hi Bluefrog. I know you’re a big advocate of markdown. I’m really quite happy with the markdown rendered view in DT3 (most of my notes are now markdown) but wondered is it possible just to increase the line spacing to say a little bit wider for example 1.5. I don’t need to have a brand-new CSS I just wondered where I might make that simple change whether that’s possible or not, by tweaking the default CSS. It would be a little easier for my eyes. Please redirect me if it’s already been covered in the forums I could not find quite what was looking for. I also know you did a great summary of styling and markdown and I couldn’t quite find that either.

Looking into the future would be lovely to have a few different built-in templates to choose from in Devon three, but I can see the prolific amount of research and development you put into this app and now you have to prioritise that accordingly and that might be pretty low on the list. Both DT3 and DTTG3 are great updates btw. Just amazing.

---

<div class="post-metadata">

**Author:** ![BLUEFROG](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/bluefrog/32/135_2.png) [@BLUEFROG](https://discourse.devontechnologies.com/u/BLUEFROG)\
**Post date:** [February 15, 2021, 11:52pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/6 "2021-02-15T23:52:36Z")

</div>

Are you already using a default stylesheet?

---

<div class="post-metadata">

**Author:** ![Grantst](https://discourse.devontechnologies.com/letter_avatar_proxy/v4/letter/g/5f9b8f/32.png) [@Grantst](https://discourse.devontechnologies.com/u/Grantst)\
**Post date:** [February 16, 2021, 12:05am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/7 "2021-02-16T00:05:49Z")

</div>

No just the standard DT3 view for markdown without stylesheet. I have tried a few stylesheets, but they are always a little over the top for me, so am happy with the out of the box view except would like to space it a little more for readability (at least for my eyes on my 13 in MBP)

---

<div class="post-metadata">

**Author:** ![BLUEFROG](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/bluefrog/32/135_2.png) [@BLUEFROG](https://discourse.devontechnologies.com/u/BLUEFROG)\
**Post date:** [February 16, 2021, 12:15am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/8 "2021-02-16T00:15:23Z")

</div>

1. Open TextEdit.
2. Create a document and press **Command-Shift-T** to convert it to plain text.
3. Enter:

```auto
body {
line-height: 1.5;
}

```

1. Save it as **DTStyle.css** in **~/Library/Application Support/DEVONthink 3/Style Sheets**.
2. In DEVONthink’s **Preferences \> Media \> Markdown** , select this stylesheet as the default.

This will apply the line height to every Markdown file in DEVONthink unless the style was overridden in a specific document.

---

<div class="post-metadata">

**Author:** ![chrillek](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/chrillek/32/29340_2.png) [@chrillek](https://discourse.devontechnologies.com/u/chrillek)\
**Post date:** [February 16, 2021, 9:50am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/9 "2021-02-16T09:50:29Z")

</div>

This approach of course works. But _only_ as long as one is not using DTTG, too. The global setting for the MD stylesheet is not carried over to DTTG (of course, since one can specify a stylesheet residing outside of DT in the Mac’s filesystem).  
Unfortunately, the only way to make a stylesheet work on the desktop _and_ the mobile version of DT is to include it in a DT database and then add a link to it at the top of _every_ MD file like so:  
`css: x-devonthink-item://0841105D-70B7-4518-8E2C-68E25CF8FC38`  
where the part after `css: ` is a link to the CSS file in the database. There’s an alternate way with a `link` element, but this has the same disadvantage: One has to include these links into each and every MD file.

May I therefore humbly suggest that one of the next DTTG versions allows for a global MD style sheet preferences as well (which should preferably be synchronized with DT)? While I’m at it: It would also be nice to be able to specify JavaScript files to be loaded by DT for all MD files. You’re doing that already implicitly with Prism (and possibly Mermaid?) anyway. Making it more flexible would allow for more MD markup without changing the internals of DT (cf. this post: [CSS für Devonthink - #13 by chrillek](https://discourse.devontechnologies.com/t/css-fur-devonthink/61962/13))

---

<div class="post-metadata">

**Author:** ![Grantst](https://discourse.devontechnologies.com/letter_avatar_proxy/v4/letter/g/5f9b8f/32.png) [@Grantst](https://discourse.devontechnologies.com/u/Grantst)\
**Post date:** [February 19, 2021, 8:07am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/10 "2021-02-19T08:07:02Z")

</div>

Thank you Bluefrog, is there a simple way of preserving the font (applying this css seems to change to times roman but not sure why)?

---

<div class="post-metadata">

**Author:** ![rfog](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/rfog/32/7487_2.png) [@rfog](https://discourse.devontechnologies.com/u/rfog)\
**Post date:** [February 22, 2024, 11:32am UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/11 "2024-02-22T11:32:43Z")

</div>

I tried this but seems not working in last 3.9.5 version. See capture. I saved the css file and restarted DT just in case.

 ![Captura de pantalla 2024-02-22 a las 12.31.16](https://devontech-discourse.s3.dualstack.us-east-1.amazonaws.com/uploads/original/3X/3/7/37c5e4223da2596978aed2ee8d7613e8d2539915.jpeg)

---

<div class="post-metadata">

**Author:** ![cgrunenberg](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/cgrunenberg/32/7172_2.png) [@cgrunenberg](https://discourse.devontechnologies.com/u/cgrunenberg)\
**Post date:** [February 22, 2024, 12:02pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/12 "2024-02-22T12:02:20Z")

</div>

> [@rfog](#):
>
> I tried this but seems not working in last 3.9.5 version. See capture. I saved the css file and restarted DT just in case.

The CSS is only used by the preview, the editor is not HTML-based.

---

<div class="post-metadata">

**Author:** ![rfog](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/rfog/32/7487_2.png) [@rfog](https://discourse.devontechnologies.com/u/rfog)\
**Post date:** [February 22, 2024, 12:30pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/13 "2024-02-22T12:30:30Z")

</div>

F\*\*\*\*… Is there any way to have bigger font size in the editor? I don’t see any working option in configuration.

---

<div class="post-metadata">

**Author:** ![rfog](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/rfog/32/7487_2.png) [@rfog](https://discourse.devontechnologies.com/u/rfog)\
**Post date:** [February 22, 2024, 12:32pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/14 "2024-02-22T12:32:43Z")

</div>

Forget it, I’ve found it. Editing → Plain Text Font.

---

<div class="post-metadata">

**Author:** ![rmschne](https://discourse.devontechnologies.com/letter_avatar_proxy/v4/letter/r/8baadc/32.png) [@rmschne](https://discourse.devontechnologies.com/u/rmschne)\
**Post date:** [February 22, 2024, 12:40pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/15 "2024-02-22T12:40:56Z")

</div>

Do you want a bigger font on the screen, or on the output file to say paper? To get bigger font on screen Menu: View → Zoom → Zoom In (or Out).

---

<div class="post-metadata">

**Author:** ![rfog](https://discourse.devontechnologies.com/user_avatar/discourse.devontechnologies.com/rfog/32/7487_2.png) [@rfog](https://discourse.devontechnologies.com/u/rfog)\
**Post date:** [February 22, 2024, 12:45pm UTC](https://discourse.devontechnologies.com/t/change-css-for-markdown-files-in-dt3/55497/16 "2024-02-22T12:45:33Z")

</div>

Forgot this one as well. You are right, but I’m getting old like hell and my eyes aren’t what used to be. I want it bigger. Bigger is better. The biggest is even best. (Sorry, I finished mi calm-pils 🤪).