Skip to main content

​
A beautiful, usable MediaWiki skin

Citizen is a responsive MediaWiki skin with extensive extension support, modern UI patterns, and powerful customization options. Built for wikis that need to look great and work seamlessly.

Get StartedView Documentation
313+ GitHub stars
70+ extensions styled
MediaWiki 1.43+
# Install Citizen skin
wfLoadSkin( ‘Citizen’ );
# Enable features
wgCitizenEnableCommandPalette <span className="text-[#3366ff]">=</span> <span className="text-yellow-400">true</span>;</div> <div className="text-white">wgCitizenEnablePreferences = true;

​
Quick start

Get Citizen up and running on your MediaWiki installation in minutes.

1

Download the skin

Download the latest release from GitHub and extract it to your MediaWiki skins/ directory.
cd /path/to/mediawiki/skins
wget https://github.com/StarCitizenTools/mediawiki-skins-Citizen/archive/main.zip
unzip main.zip
mv mediawiki-skins-Citizen-main Citizen
2

Enable the skin

Add the following line to your LocalSettings.php file:
LocalSettings.php
wfLoadSkin( 'Citizen' );
3

Configure options (optional)

Customize Citizen’s behavior by adding configuration variables:
LocalSettings.php
# Enable command palette
$wgCitizenEnableCommandPalette = true;

# Enable user preferences panel
$wgCitizenEnablePreferences = true;

# Set default theme (auto, light, or dark)
$wgCitizenThemeDefault = 'auto';
After enabling Citizen, your wiki will have a responsive layout with light/dark mode support, a command palette for quick navigation, and extensive styling for MediaWiki extensions.
4

Verify installation

Navigate to Special:Version on your wiki to confirm that Citizen is installed and active. You should see it listed under the “Installed skins” section.

​
Key features

Citizen brings modern UI patterns and powerful features to MediaWiki.

Responsive layout

Adapts seamlessly to all screen sizes with mobile-first design principles and optimized touch interactions.

Command palette

Quick access to pages, search, and actions with keyboard shortcuts. Navigate your wiki at lightning speed.

Light & dark mode

Beautiful themes with automatic detection and smooth transitions. Users can choose their preferred appearance.

Extensible preferences

Let users customize their experience with font size, width, performance mode, and more.

Collapsible sections

Improve readability with collapsible article sections and a persistent table of contents.

Progressive Web App

Add your wiki to home screens for an app-like experience with offline support and web manifest.

Extension support

Styled support for 70+ MediaWiki extensions including VisualEditor, Semantic MediaWiki, and more.

Vue 3 components

Built with modern Vue 3 composition API for interactive features like search and preferences.

​
Explore by topic

Find the documentation you need to configure, customize, and extend Citizen.

​
Configuration

Configure theme settings, search behavior, layout options, and feature flags to customize your wiki’s behavior.

View configuration guides

​
Customization

Customize Citizen’s appearance with CSS variables, modify templates, and integrate with MediaWiki’s ResourceLoader.

Learn about theming

​
Extension Support

Discover the 70+ MediaWiki extensions styled by Citizen and learn how to add support for additional extensions.

Browse supported extensions

​
Development

Set up a development environment, understand the architecture, and contribute to Citizen’s codebase.

Start contributing

​
Ready to transform your wiki?

Install Citizen today and give your MediaWiki site a modern, professional look with powerful features your users will love.

Install CitizenView on GitHub

Build docs developers (and LLMs) love

Get started for freeTalk to us