Exporting doesn't get custom CSS rules set in the software

[frecio231]

Preflight Checklist

• I agree to follow the Code of Conduct that this project adheres to.
• I have searched the issue tracker for a feature request that matches the one I want to file, without success.

You must search the issue tracker and agree to the code of conduct. You must fill in this entire template. If you delete part/all or miss parts out your issue will be closed.

If you are technical, you should report bugs along the lines of https://marker.io/blog/how-to-write-bug-report. If you are not technical, we will make allowances, please try to make an effort to understand the process.

Describe the bug
The exporting of a document won't keep Custom CSS rules in the final document.

To Reproduce
Steps to reproduce the behavior:

1. Go to Extras
2. Click on Configuration
3. Scroll down to Custom CSS
4. Add new CSS Rules, for example a class changing the behavior of a div
5. Apply
6. Reset the software
7. On the top bar clic the < > (HTML) button
8. Add a class to the HTML tag of your text.
9. Go to File
10. Click on Export As ->
11. Select any of the options, (I have checked HTML, SVG, PDF, PNG)
12. Save your file to your PCExpected behavior
    The generated file should look as the file the program.

Screenshots

My file on the desktop My file on a PDF viewer.

draw.io version (In the Help->About menu of the draw.io editor):

• draw.io v29.7.9

Desktop (please complete the following information):

• OS: Windows
• OS Version 11, version 25H2

I tested the problem in incognito/private mode with all browser extensions switched off, write "yes" below:

• N/A as I'm using the desktop version

Additional context
Add this code so the MWE can work.

.cuadro-amarillo {
    margin-right: 5px;
    margin-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
}

.cuadro-amarillo .titulo {
    padding: 5px;
    text-align: center;
    font-weight: bold;
    border: 1px solid #deb80e;
    border-bottom: 0px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.cuadro-amarillo .cuadro-texto {
    padding: 5px;
    border: 1px solid #deb80e;
    line-height: 0.9;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.cuadro-texto ul {
    margin-top: 10px;
    margin-bottom: 1px;
    padding-left: 20px;
}

.cuadro-texto p {
    margin-top: 4px;
    margin-bottom: 1px;
}

MWE.drawio

[draw-io-triage-bot]

👋 Thank you for opening this issue!

---

Summary: The user is reporting that custom CSS rules added via Extras → Configuration → Custom CSS are not included in exported files (HTML, SVG, PDF, PNG), causing the exported output to look different from how the diagram appears in the editor. This is likely by design, as the Configuration custom CSS is meant to style the editor UI rather than diagram content, and the user may need to use inline styles within HTML labels instead.

---

🔍 Possible Related Issues

This issue might be related to existing issues:

🟡 #5551 - Custom Fonts in PDF export broken
Both issues relate to custom styling/fonts not being preserved in PDF and other exports, though the root cause differs — this issue is about custom CSS classes from editor configuration, while #5551 is about custom font rendering.

Please check if any of these address your issue. If this is a duplicate, we may close this issue and continue the conversation there.

📝 Additional Information Needed

To help us investigate this more effectively, could you please provide:

• Can you clarify whether you understand that the 'Custom CSS' in Extras → Configuration is intended for customizing the draw.io editor UI itself, not for styling the content of your diagrams? Custom CSS rules added there are not part of the diagram data and thus are not expected to be included in exports.
• Have you considered using draw.io's built-in styling capabilities (e.g., shape styles, formatted text/HTML labels with inline styles) to achieve the visual appearance you want, rather than relying on external CSS classes? Inline styles within HTML labels would be preserved on export.
• As a workaround, have you tried embedding your CSS rules as inline styles directly within the HTML labels of your shapes (using the style attribute), which would ensure they are included in the exported output?

📋 Bug Report Template

**Environment:**
- draw.io version: [e.g., web app / desktop 24.x.x / Confluence plugin]
- Browser (if web): [e.g., Chrome 120, Firefox 121]
- OS: [e.g., Windows 11, macOS 14, Ubuntu 22.04]

**Steps to Reproduce:**
1. Go to ...
2. Click on ...
3. See error

**Expected Behavior:**
What you expected to happen.

**Actual Behavior:**
What actually happened.

**Screenshots/Files:**
If applicable, add screenshots or attach the .drawio file.

---

---

_{🤖 This is an automated response to help with initial triage. A human maintainer will review this issue. If you've provided all the requested information, no further action is needed - we'll get back to you soon!}