User:Tro/Firefox 4.0 Mac Theme Mockups

From MozillaWiki
Jump to: navigation, search
Draft-template-image.png THIS PAGE IS A WORKING DRAFT Pencil-emoji U270F-gray.png
The page may be difficult to navigate, and some information on its subject might be incomplete and/or evolving rapidly.
If you have any questions or ideas, please add them as a new topic on the discussion page.


Feedback is entirely welcome and encouraged. Hit the discussion button at the top :)

(For 3.7 Mockups: User:Tro/Firefox 3.7 Mac Theme Mockups)

Mac Theme Mockups for Firefox 4.0

Large Back Button


Style changes from 3.7 to 4.0 are fairly minimal except for new elements that must be styled:

  • Extensions Area: Proposed idea is to be stylistically different from the rest of the toolbar. Lighter and slightly raised.
  • Profile Button: The Profile button can be seen in the upper right of the mockup. The idea is to be attached to the window, much like a label or a tag.
  • Search Selector Style: This area is still not fully developed. An idea is to have the search selector change color based on which search is being used.

Small Back Button


Darker Background

Fx-4.0-Mockup-Mac-i03-Darker.png An alternate version with a darker background. This would make active tabs stand out more.

App-Tab Example

Fx-4.0-Mockup-Mac-i03-App-Tab.png How an App-Tab could look. No toolbars for navigation since all navigation is self-contained in the web app.

Potential Styling for Various Search Types

Fx-4.0-Mockup-Mac-i03-Colored-Search-Selector.png This is an area that is not yet fully developed. Potential styling for search selectors in the combined location+search bar could change color based on which search engine you are using.