Home Wiki > Hilfe:Design
Sign up | Login

Hilfe:Design

tagline: Aus openSUSE

Dieser Artikel dokumentiert das Design der openSUSE-Wikis im Bento-Theme (von en: theme, ca. Motiv, Thema für graphisches Design im Softwarebereich) und sollte als Styleguide (Gestaltungsrichtlinie) benutzt werden.

Vorlagen gibt es hier und der gesamte Quellcode ist auf gitorious verfügbar.

[Bearbeiten] Farbschema

[Bearbeiten] Hauptfarben

Beschreibung (Name) Hex RGB Farbbeispiel Beispiel für Anwendung der Farbe
Dunkelgrau
(Dark Grey)
#444444 68 68 68 Schriftzeichen
Mittelgrau
(Medium Grey)
#666666 102 102 102 Hintergrund der Navigation
Hellgrau 1
(Light Grey 1)
#999999 153 153 153 Schrift in einem Eingabefeld, das nicht auswählt wurde
Hellgrau 2
(Light Grey 2)
#DDDDDD 221 221 221 Kopf- und Fußzeile eines Kastens
(Box Header and Footer)
Hintergrundgrau
(BG Grey)
#F6F6F6 246 246 246 Hintergrund im Hauptteil
(Body Background)
Blau 1
(Blue 1)
#006699 0 102 153 Verknüpfungen im Inhalt
(Content Links)
Blau 2
(Blue 2)
#3399CC 51 153 204 Verknüpfungen beim Darüberstreichen mit dem Mauszeiger
(Content Links hover)
Grün 1
(Green 1)
#669900 102 153 0 Verknüpfungen außerhalb des Inhalts
(Text-Links outside of content)
Hellgelb
(Light Yellow)
#FBF9EE 251 249 238 Hintergrund eines Kastens für Benachrichtigungen
(Notification Box Background)
Gelb
(Yellow)
#FCEFA1 252 239 161 Grenzlinie eines Kastens für Benachrichtigungen
(Notification Box Border)
Hellrot
(Light Red)
#FEF1EC 254 241 236 Hintergrund eines Kastens für Fehlermeldungen
(Error Notification Box Background)
Rot
(Red)
#CC0000 204 0 0 Grenzlinie und Schriftzeichen eines Kastens für Fehlermeldungen
(Error Notification Box Border and Font-Color)

Die entsprechenden Farbpaletten stehen auf colourlovers.com zur Verfügung:

Palette Grau: Bento-Theme Grey
Palette Farbig: Bento-Theme Colors
Palette für Sofortbenachrichtigungen: Bento-Theme Flash

[Bearbeiten] Farben für Schatten, Grenzlinien usw. (UI-Style)

Beschreibung (Name) Hex RGB Farbbeispiel Beispiel für Anwendung der Farbe
Sehr dunkels Grau
(Dark Grey)
#111111 17 17 17 Untere Grenzlinie eines Kastens
(Box Bottom Border)
Mittelgrau 2
(Medium Grey 2)
#4E4E4E 78 78 78 Haupttrennlinie in Navigation
(Main Navigation Separator)
Grau für dunkle Schatten
(Dark Shadow Grey)
#222222 34 34 34 Schattenwurf Kasten
(Box Dropshadow)
Grau für helle Schatten
(Light Shadow Grey)
#CCCCCC 204 204 204 Schattenwurf Kasten
(Box Dropshadow)

Auch hierfür steht die entsprechende Farbpalette auf colourlovers.com zur Verfügung:

Palette: Bento-Theme UI-Sytle


[Bearbeiten] Auswahl der Icons (Standard)

Die Standardicons (Standardpiktogramme) für das Bento-Theme sind:

Auf die Icons aus dem Tango Icon Theme hat man sich nach dieser Diskussion auf der Mailing-Liste opensuse-artwork geeinigt.


[Bearbeiten] Siehe auch