# Presets

What each of Techno's three presets is for, what it installs, and how switching a preset differs from switching a color palette.

Techno comes in three presets: Techno, Flagship and Datasheet. Each has its own listing on the Shopify Theme Store and its own demo store, and each installs its own home page, product page, header and footer. They're the same theme underneath: every section, block and setting is in all three, so anything one preset does, another can do after a few changes in the theme editor.

## Which preset to choose

* **Techno**, for a consumer tech and accessories store with a few dozen products: the terminal look, with a dark palette, the system monospace font and the boot sequence.
* **Flagship**, for a brand built around one main product and a few accessories, such as a keyboard or an audio device: a light, calm page that tells the product's story, with room for its parts and questions.
* **Datasheet**, for a large catalog of parts, components or tools, with buyers who order in quantity: a wide, dense page on a drafting grid, with a mega menu, long product lists and the spec table directly under the price.

## What each preset sets

Theme settings:

| Setting | Techno | Flagship | Datasheet |
| --- | --- | --- | --- |
| Colors › "Color palette" | Techno | Monolith | Blueprint |
| Typography › "Primary font" | System monospace | IBM Plex Mono | IBM Plex Sans Condensed |
| Typography › "Base text size" | 14 px | 15 px | 14 px |
| Layout › "Page width" | Medium | Narrow | Wide |
| Layout › "Page margin" | 18 px | 18 px | 14 px |
| Motion and effects › "Show grid overlay" | Off | Off | On |
| Motion and effects › "Show boot sequence on load" | On | Off | Off |
| Copy › "Show system chatter in copy" | On | Off | Off |
| Commerce › "Show currency code" | Off | Off | On |
| Product cards | No quick view or quick add | "Show quick add button" and "Show second image on hover" on | "Show quick view button" and "Show quick add button" on |
| Navigation › "Position" (back-to-top button) | Left | Right | Left |

No preset changes a single color, so each uses its palette exactly as [Colors & palettes](../core-concepts/theme-styles-and-color.md) describes. Flagship and Datasheet load a font from Shopify's library, with its bold, italic and bold italic styles; Techno uses the visitor's own monospace font, which needs no download.

Pages, header and footer:

| | Techno | Flagship | Datasheet |
| --- | --- | --- | --- |
| Home page | Hero, Featured collection, Kits, Newsletter | Hero, Featured product, Schematic, two Image with text sections, Kits, FAQ, Featured collection "Accessories", Newsletter | Hero, three Featured collections ("In the catalog", "Components", "Tools"), Kits, Image with text, Rich text, Newsletter |
| Product page | Product, with the vendor line and the spec table after the description, and two rows of recommendations | Product without the vendor line, an Image with text section, and complementary recommendations "Accessories" | Product with the spec table, barcodes included, directly under the price, a Quick order list, complementary recommendations "Pairs well with" and related "Related parts" |
| Collection and search pages | 12 products a page | 12 products a page | 36 products a page; collection cards show the vendor |
| Header | Mega menu, status strip with "Uplink", your product count and the free dispatch note | Dropdown menu, the header hides as shoppers scroll down, status strip with your product count | Mega menu, status strip with your product count and the free shipping note |
| Footer | Newsletter, a menu, social links | Newsletter, a menu, social links | Two menus, a text column, newsletter, social links |

The header and footer menus use your store's main menu and footer menu, which every Shopify store has. Sections that show products or collections start empty, apart from Techno's "Top of stack" and Datasheet's "In the catalog" rows, which show all your products, and the recommendation rows, which Shopify fills: they show placeholder cards on your storefront and a hint in the theme editor until you choose what goes in them. The Schematic and Image with text sections show a placeholder drawing until you add an image.

No preset promises shipping, returns, a warranty, delivery times or a reply time. The free shipping note in the header and cart stays hidden until you set Theme settings › Commerce › "Free dispatch over", and the text each preset ships describes what the section is for until you write your own.

## Switching preset or palette

There are two settings with similar names, and they do different things:

* **Theme settings › Colors › "Color palette"** changes the ten colors and nothing else. Switch palettes here at any time. See [Colors & palettes](../core-concepts/theme-styles-and-color.md).
* **Theme settings › Theme style**, the entry Shopify adds at the bottom of Theme settings, lists the three presets. Choosing one applies every theme setting the preset sets: everything in the first table above, and also these, which every preset sets the same way:
  * the ten colors below Colors › "Color palette", which every preset leaves empty, so any color you changed goes back to following the palette;
  * Navigation › "Show back-to-top button", on;
  * Brand › "Use a custom logo", off, and "Logo width", 180 px;
  * Motion and effects › "Show scanline overlay", off;
  * Commerce › "Free dispatch over", 0;
  * Product cards › "Show swatches", off, and "Swatches before "+" count", 5.

  It overwrites your changes to all of them, so after switching, set your own colors again, turn "Use a custom logo" back on, turn the back-to-top button, the scanline overlay or swatches back to how you had them, and re-enter your free shipping amount. Your text and images, including the logo image itself, stay.

Choosing a theme style doesn't change your pages, header or footer. Those come with a preset only when you add Techno from that preset's Theme Store listing. To use another preset's pages later, add its sections in the theme editor, using the second table above as the list, or add that preset as a second theme and copy what you want from it.

## See also

* [Installing Techno](installation.md): the set-up checklist
* [Home page](../building-pages/home-page.md): the Techno preset's home page and the sections to build others
* [Typography, layout & brand](../core-concepts/typography-and-layout.md): fonts, sizes and page width
