In this post I'll share with you my web style guide template. A web style guide is a document where you specify elements like logo treatment, color scheme, typography, buttons, form fields, or anything else that you think is important for the website project you're working on. MS Word Style Sheet Select View>Toolbars>Formatting to view the styles listed below. You can also select Styles and Formatting from the Format menu to view all Styles in the right hand reference panel. Title Subtitle Date TOC Heading TOC 1(Heading 1) 8 TOC 2 (Heading 2) 8 TOC 3 (Heading 3) 8 Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 HubSpot — How to Create a Writing style guide Built for the Web; Meet Content — Editorial Style for the Web; Pebble Road — Creating and maintaining a web style guide; Pressly — 5 style guides for better content; Stanford — Creating a web style guide; UCR — Writing for the Web, Content Guidelines; Unbound — 7 things to put into a 6. Free Creative Adobe XD UI Style Guide Template. Adobe XD UI style guide is a creative freebie shared by the UI designer, Mehedi Hasan. It includes guidelines for typefaces, UI elements, colors, grids, and more. It is a good tool for designers to create a website/app with bright colors. Free download. 7. Free Sketch UI Style Guide Template 1. Google. In Google's style guide, they are very explicit with its principle to create clear, accurate, concise text. The company offers clear directives to write simply and directly, address users clearly, and more. They also skillfully demonstrate examples of what employees should and should not do. Use this free style guide template layout to create a custom brand manual for your startup, small or large company. Add your own logo, colors, typography and other elements to fully represent your brand. This template is perfect for communicating your brand with style and sharing guidelines internally within your company. Step 4: Gather User Feedback and Publish Your Style Guide Online. Ultimately, the decisions you make for your style guide are at your discretion. However, you might be able to create a more productive and more functional document if you gather input from others who may be impacted by it. Styleguide UI Templates Style Guide Preview Template (Sketch) by Tony Jones. If you're using Sketch App, this free Style Guide Preview Template will help you develop a nice, clean Styleguide.. UI Style Guide Template (PSD) by Tony Thomas. UI Style Guide Template is a Photoshop (PSD) template featuring color swatches, typography, iconography, form and UI elements. Step 2: Review & Document Your Style Exceptions. Typically, a style guide will include the following: Basic editorial rules, such as the spelling out of numerals, how and when you capitalize job titles, rules for abbreviations, how times of day should be expressed, etc. the Carleton Identity Style Guide. Note that the yellow and blue colors specified in the style guide for the web are . not. identical to those specified for print. Pantone's equivalents to Carleton's print swatches are not appealing on-screen colors. Use the web-specific colors for web design and content. Use the Bluebar navigation The typography section of your style guide should identify: The selected font to be used throughout your product The variety of font sizes and weights to articulate the headings hierarchy Additional typographical elements like how a link should appear when it