# Using a CSS file in Wix Studio

**URL:** <https://forum.wixstudio.com/t/using-a-css-file-in-wix-studio/80382>\
**Category:** Ask the community\
**Tags:** code, question, wix-studio\
**Created:** [October 23, 2026, 9:55pm UTC](https://forum.wixstudio.com/t/using-a-css-file-in-wix-studio/80382 "2026-10-23T21:55:26Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![CelesteJ](https://avatars.discourse-cdn.com/v4/letter/c/bc79bd/32.png) [@CelesteJ](https://forum.wixstudio.com/u/CelesteJ)\
**Post date:** [October 23, 2026, 9:55pm UTC](https://forum.wixstudio.com/t/using-a-css-file-in-wix-studio/80382/1 "2026-10-23T21:55:26Z")

</div>

**I’m having trouble with**  
I’m really wanting to use CSS with an older Wix website.

**Working in**  
Wix Website Editor/Wix Studio Classic

**Site link**

[https://canadaconfesses.ca/test.css](https://canadaconfesses.ca/test.css)

**What I’m trying to do**  
I found I can add a css file to Backend & Public → Public, and it is available in the root, but if I try to access it, I get a 400 error with an html error page.

Here is the error page:

```xml

  <!DOCTYPE html>
<!--
    

    

  
  
      
-->
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="noindex">
    <title>400 Error: Bad Request</title>

    
    <script async src="https://static.parastorage.com/polyfill/v2/polyfill.min.js?features=default,es6,es7,es2017&flags=gated&unknown=polyfill&rum=0"></script>
    <script src="https://static.parastorage.com/unpkg-semver/fedops-logger@5/fedops-logger.bundle.min.js"></script>
    <script>fedopsLogger.reportAppLoadStarted("classic-error-pages-statics");</script>
    <script src="https://static.parastorage.com/unpkg-semver/header-footer-provider/app.bundle.min.js"></script>
    <script crossorigin src="https://static.parastorage.com/unpkg/react@18.2.0/umd/react.production.min.js"></script>
    <script crossorigin src="https://static.parastorage.com/unpkg/react-dom@18.2.0/umd/react-dom.production.min.js"></script>

    <link rel="stylesheet" href="//static.parastorage.com/services/classic-error-pages-statics/1.98.0/app.min.css">

    <link rel="preload" as="font" href="https://static.parastorage.com/unpkg/@wix/wix-fonts@1.14.0/media/WixMadeforTextVF_W_Wght.8022447a.woff2" crossorigin>
    <link rel="preload" as="font" href="https://static.parastorage.com/unpkg/@wix/wix-fonts@1.14.0/media/WixMadeforDisplayVF_W_Wght.ab35e4df.woff2" crossorigin>
    <link rel="stylesheet" href="https://static.parastorage.com/unpkg/@wix/wix-fonts@1.14.0/madefor.min.css">
    <link rel="stylesheet" href="https://static.parastorage.com/unpkg/@wix/wix-fonts@1.14.0/madeforDisplay.min.css">

</head>
<body>
<div id="root"></div>
<script>
    window. __LOCALE__ = 'en';
    window. __ERROR_DATA__ = {
        staticsUrl: '//static.parastorage.com/services/classic-error-pages-statics/1.98.0/',
        baseDomain: 'wix.com',
        errorCode: '400-NotBranded',
        exceptionName: '',
        serverErrorCode: '-100',
        data: {},
        brand: 'wix',
        requestId: '1792791148.549299712011467'
    };
</script>
<script src="//static.parastorage.com/services/classic-error-pages-statics/1.98.0/app.bundle.min.js"></script>
</body>
</html>

```

Here is the original file:

```css
/** test file to see if css files can be served and linked to by pages */

```

**What I’ve tried so far**

As a workaround, I can add inline styling using a style element, added through Settings → Custom Code → Head:

```xml
<style>

</style>

```

This is not optimal, since it bloats the web page.

---

<div class="post-metadata">

**Author:** ![Ecom\_swift\_LLC](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/ecom_swift_llc/32/122562_2.png) [@Ecom\_swift\_LLC](https://forum.wixstudio.com/u/Ecom_swift_LLC)\
**Post date:** [October 24, 2026, 7:11am UTC](https://forum.wixstudio.com/t/using-a-css-file-in-wix-studio/80382/2 "2026-10-24T07:11:22Z")

</div>

Hi Celeste, the 400 is expected. Files under Backend & Public are code modules for Velo, not static assets, so Wix doesn’t serve them at a URL like /test.css. The clean way is to host the CSS file somewhere that serves static files (a GitHub repo through jsDelivr, or any CDN or storage you control) and link it from Settings \> Custom Code, in the Head, with a normal link tag: . Set it to load on all pages, or only the ones that need it. That gets rid of the inline style bloat and the file stays cached by the browser. If this helped, please mark it as Solved.

---

<div class="post-metadata">

**Author:** ![CelesteJ](https://avatars.discourse-cdn.com/v4/letter/c/bc79bd/32.png) [@CelesteJ](https://forum.wixstudio.com/u/CelesteJ)\
**Post date:** [October 24, 2026, 10:01pm UTC](https://forum.wixstudio.com/t/using-a-css-file-in-wix-studio/80382/3 "2026-10-24T22:01:49Z")

</div>

Really wish this was communicated in the editor. Especially considering you can choose an arbitrary file alongside a “.js” file. This decision by Wix makes no sense, it is very easy to detect a file mime type by extension and would help Wix compete as a legitimate web host.

But, nothing I can do, appreciate the response.

---

<div class="post-metadata">

**Author:** ![Ecom\_swift\_LLC](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/ecom_swift_llc/32/122562_2.png) [@Ecom\_swift\_LLC](https://forum.wixstudio.com/u/Ecom_swift_LLC)\
**Post date:** [October 24, 2026, 10:10pm UTC](https://forum.wixstudio.com/t/using-a-css-file-in-wix-studio/80382/4 "2026-10-24T22:10:35Z")

</div>

Fair point, a note about this in the editor would save people a lot of time. jsDelivr is free and works well for this, and you can pin a version so the file stays cached. Good luck with the site.
