Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Game UI Wiki: Difference between revisions

From Game UI Wiki
(Add faint outline back to cards)
(Reorder game cards by most recently added first)
 
(6 intermediate revisions by the same user not shown)
Line 9: Line 9:
<div class="infobox" style="float: none; max-width: 100%; width: 100%; margin: 10px 0 16px 0;">
<div class="infobox" style="float: none; max-width: 100%; width: 100%; margin: 10px 0 16px 0;">
<div class="infobox-fields">
<div class="infobox-fields">
<div class="infobox-field"><div class="infobox-label">Games</div><div class="infobox-value">10</div></div>
<div class="infobox-field" style="text-align: center;"><div class="infobox-value">12</div><div class="infobox-label">Games</div></div>
<div class="infobox-field"><div class="infobox-label">Screenshots</div><div class="infobox-value">282</div></div>
<div class="infobox-field" style="text-align: center;"><div class="infobox-value">394</div><div class="infobox-label">Screenshots</div></div>
<div class="infobox-field"><div class="infobox-label">Categories</div><div class="infobox-value">94</div></div>
<div class="infobox-field" style="text-align: center;"><div class="infobox-value">94</div><div class="infobox-label">Categories</div></div>
</div>
</div>
</div>
</div>
Line 18: Line 18:


<div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px;">
<div style="display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px;">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
[[File:BaldursGate3_Frontend.png|400px|link=Baldur's Gate 3]]
[[File:RevengeOfTheSavagePlanet_Title_Screen_3D_Logo.png|400px|link=Revenge of the Savage Planet]]
<div style="padding: 8px; text-align: center;">'''[[Baldur's Gate 3|Baldur's Gate 3]]'''<br/><small>PC - RPG</small></div>
<div style="padding: 8px; text-align: center;">'''[[Revenge of the Savage Planet|Revenge of the Savage Planet]]'''<br/><small>Action-adventure</small></div>
</div>
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
[[File:Helldivers2_Ship_Hub_Overview.png|400px|link=Helldivers 2]]
<div style="padding: 8px; text-align: center;">'''[[Helldivers 2|Helldivers 2]]'''<br/><small>Third-person shooter</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:Wolfenstein3D_Frontend.png|400px|link=Wolfenstein 3D]]
[[File:OblivionRemastered_Frontend.jpg|400px|link=The Elder Scrolls IV: Oblivion Remastered]]
<div style="padding: 8px; text-align: center;">'''[[Wolfenstein 3D|Wolfenstein 3D]]'''<br/><small>FPS</small></div>
<div style="padding: 8px; text-align: center;">'''[[The Elder Scrolls IV: Oblivion Remastered|Oblivion Remastered]]'''<br/><small>PC - RPG</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:Populous_Frontend.png|400px|link=Populous]]
[[File:RimWorld_Frontend.jpg|400px|link=RimWorld]]
<div style="padding: 8px; text-align: center;">'''[[Populous|Populous]]'''<br/><small>God Game</small></div>
<div style="padding: 8px; text-align: center;">'''[[RimWorld|RimWorld]]'''<br/><small>PC - Simulation</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:UmamusumePrettyDerby_Frontend.jpg|400px|link=Umamusume: Pretty Derby]]
[[File:WorldofTanks_Garage.jpeg|400px|link=World of Tanks]]
<div style="padding: 8px; text-align: center;">'''[[Umamusume: Pretty Derby|Umamusume: Pretty Derby]]'''<br/><small>Simulation</small></div>
<div style="padding: 8px; text-align: center;">'''[[World of Tanks|World of Tanks]]'''<br/><small>PC - MMO</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:SunlessSea_Frontend.png|400px|link=Sunless Sea]]
[[File:SunlessSea_Frontend.png|400px|link=Sunless Sea]]
<div style="padding: 8px; text-align: center;">'''[[Sunless Sea|Sunless Sea]]'''<br/><small>PC - RPG</small></div>
<div style="padding: 8px; text-align: center;">'''[[Sunless Sea|Sunless Sea]]'''<br/><small>RPG</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:BaldursGate3_Frontend.png|400px|link=Baldur's Gate 3]]
[[File:UmamusumePrettyDerby_Frontend.jpg|400px|link=Umamusume: Pretty Derby]]
<div style="padding: 8px; text-align: center;">'''[[Baldur's Gate 3|Baldur's Gate 3]]'''<br/><small>RPG</small></div>
<div style="padding: 8px; text-align: center;">'''[[Umamusume: Pretty Derby|Umamusume: Pretty Derby]]'''<br/><small>Mobile</small></div>
</div>
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
[[File:WorldofTanks_Garage.jpeg|400px|link=World of Tanks]]
<div style="padding: 8px; text-align: center;">'''[[World of Tanks|World of Tanks]]'''<br/><small>MMO</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:BrookhavenRP_Frontend.jpg|400px|link=Brookhaven RP (Roblox)]]
[[File:BrookhavenRP_Frontend.jpg|400px|link=Brookhaven RP (Roblox)]]
<div style="padding: 8px; text-align: center;">'''[[Brookhaven RP (Roblox)|Brookhaven RP (Roblox)]]'''<br/><small>Roblox</small></div>
<div style="padding: 8px; text-align: center;">'''[[Brookhaven RP (Roblox)|Brookhaven RP (Roblox)]]'''<br/><small>Roleplay</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:RimWorld_Frontend.jpg|400px|link=RimWorld]]
<div style="padding: 8px; text-align: center;">'''[[RimWorld|RimWorld]]'''<br/><small>Simulation</small></div>
</div>
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
[[File:StickyBusiness_Frontend.png|400px|link=Sticky Business]]
[[File:StickyBusiness_Frontend.png|400px|link=Sticky Business]]
<div style="padding: 8px; text-align: center;">'''[[Sticky Business|Sticky Business]]'''<br/><small>PC - Simulation</small></div>
<div style="padding: 8px; text-align: center;">'''[[Sticky Business|Sticky Business]]'''<br/><small>Simulation</small></div>
</div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 8px; background: var(--color-surface-2, #2a2a3a);">
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:OblivionRemastered_Frontend.jpg|400px|link=The Elder Scrolls IV: Oblivion Remastered]]
[[File:Wolfenstein3D_Frontend.png|400px|link=Wolfenstein 3D]]
<div style="padding: 8px; text-align: center;">'''[[The Elder Scrolls IV: Oblivion Remastered|Oblivion Remastered]]'''<br/><small>RPG</small></div>
<div style="padding: 8px; text-align: center;">'''[[Wolfenstein 3D|Wolfenstein 3D]]'''<br/><small>PC - FPS</small></div>
</div>
 
<div class="game-card" style="border: 1px solid var(--border-color-base, #555); border-radius: 0; background: var(--color-surface-2, #2a2a3a);">
[[File:Populous_Frontend.png|400px|link=Populous]]
<div style="padding: 8px; text-align: center;">'''[[Populous|Populous]]'''<br/><small>PC</small></div>
</div>
</div>
</div>
</div>

Latest revision as of 13:10, 20 February 2026

Game UI Wiki
The open game UI archive.

Start contributing | Create an account

12
Games
394
Screenshots
94
Categories

Games

Browse by screen type

Menus: Frontend · Settings · Game Menu · Pause · Load Game · Credits
Gameplay: HUD · Inventory · Map · Dialogue · Combat · Crafting · Skill Tree
Social: Friends List · Lobby · Messages · Profile · Achievements
Overlay: Modal · Popup · Radial Menu · Loading
Onboarding: Onboarding · Help · Create Character

Browse by platform & genre

Platform: PC · Console · Mobile · Roblox · Steam Deck

Genre: RPG · FPS · Simulation · MMO · Survival · Open World

See all categories for the full list.

How to add a game

  1. Create an account and confirm your email
  2. After 1 day, search for a game - if no page exists, click "Create the page"
  3. Copy the template from Template:Game/Preload and add your screenshots
  4. See How to contribute for the full guide

Anyone can add games, upload screenshots, and improve pages.