Skip to content

A custom CSS file that provides a dark theme and larger text for Swagger UI documentation pages in FastAPI applications.

License

Notifications You must be signed in to change notification settings

emrecpp/swagger-fastapi-dark-theme

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🌃 Swagger FastAPI Dark Theme

A custom CSS file that provides a dark theme and larger text for Swagger UI documentation pages in FastAPI applications.

Features

  • Dark mode for Swagger UI
  • 📱 Enlarged text size for better readability
  • 🎨 Modify the CSS to suit your preferences.
  • 🚀 Easy integration
  • ⚡ Fully compatible with FastAPI applications

✨ Example Appearance

Swagger Dark Theme

🛠️ Installation & Usage

  1. Download a CSS injector extension. For example, you can use the Stylus extension from this link.

  2. Open your FastAPI docs page (Swagger UI).

  3. Click on the Stylus extension and select "Create new style".

  4. Copy and paste all CSS code from the CSS file (this link) into the editor.

  5. Add the following URLs to the "Applies to" section in Stylus to ensure the CSS is applied to your local FastAPI Swagger UI:
    http://localhost
    http://127.0.0.1

    or your custom domain (https://mydomain.com)

  6. Click save.

  7. Tada! 🎉🥳 That's all there is to it.

Stylus Setup

🎨 Customization

You can customize the CSS file according to your needs:

  • Update the relevant CSS variables to change the color palette
  • Adjust font-size values to modify text sizes

🤝 Contributing

  1. Fork this repository
  2. Add new features or fix bugs
  3. Submit a pull request

License

MIT

Don’t forget to star the repo if you find it useful!

About

A custom CSS file that provides a dark theme and larger text for Swagger UI documentation pages in FastAPI applications.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages