Meet Otto
Client Style Kit

Use this style guide template to quickly align your websites brand and visual direction. Take control of global styles to edit typography, colours & elements across the whole site.

Product Overview

Meet Otto - the perfect template for your next SaaS, Dashboard, App or Software website. Otto provides the ultimate base for Webflow designers and developers to truely craft something special for themselves or their clients. Built and supported by the leading Webflow team, Otto is built for production and your success.

Ultra clean class-naming and construction, variety of core pages, beautiful forms, sections, layouts and everything you need to get started. Otto also contains a comprehensive design system that can help you make the most out of altering colours and typography.
‍

Colour Palette

Not sure on something? support@flowbase.co

Primary Palette

BRAND COLOURS

Purple 900

Dark

Purple 700

Dark

Purple 600

PRIMARY

Purple 500

tint

Purple 300

tint

Purple 100

tint

Teal 900

DARK

Teal 700

DARK

Teal 600

PRIMARY

Teal 500

tint

Teal 300

tint

Teal 100

tint

Pink 900

DARK

Pink 700

DARK

Pink 600

PRIMARY

Pink 500

tint

Pink 300

tint

Pink 100

tint

Secondary Palette

GRADIENT

Purple

Dark

Purple

Dark

Purple

PRIMARY

Purple

tint

Purple

tint

Purple

tint

Teal

DARK

Teal

DARK

Teal

PRIMARY

Teal

tint

Teal

tint

Teal

tint

Pink 900

DARK

Pink 700

DARK

Pink 600

PRIMARY

Pink 500

tint

Pink 300

tint

Pink 100

tint

Typography Palette

HEADING & PARAGRAPH

Grey 900

#2d3958

Grey 700

#546285

Grey 600

#7b88a8

Grey 500

#bcc4da

Grey 300

#e6eaf5

Grey 100

#f8faff

Typography Styles

Not sure on something? support@flowbase.co

Headings

Aa Bb Cc Dd Ee

Display

64px

Aa Bb Cc Dd Ee

Heading 1

48px

Aa Bb Cc Dd Ee

Heading 2

40px

Aa Bb Cc Dd Ee

Heading 3

34px

Aa Bb Cc Dd Ee

Heading 4

20px

Aa Bb Cc Dd Ee

Heading 5

18px

Aa Bb Cc Dd Ee

Heading 6

12px

Paragraph

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

Paragraph Large

22px

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

Paragraph Normal

16px

Paragraph Small

14px

Quotes & Lists

Not sure on something? support@flowbase.co

Quotes

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Quote 1

Default

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Quote 2

Coloured

Lists

Example Item 1
Example Item 2
Example Item 3

List Dots

Example Item 1
Example Item 2
Example Item 3

List Numbers

Example Item 1
Example Item 2
Example Item 3

List Letters

Buttons

Not sure on something? support@flowbase.co

Button Primary

Button Primary

Button Outline

Button Outline

Button Outline

Button Secondary

Submit

Quality a as Service

Configuración de pipelines para pruebas, Reforzar las mejores prácticas y el testeo ágil al grupo de desarrollo. Enseñar al equipo nuevas habilidades de QA, Integración de Static Code Analizer para sus repositorios de código.

Pruebas de Stress

Evitamos tiempos de inactividad del sistema. Nuestros expertos detectan problemas de performance, eliminan cuellos de botella y monitorean la confiabilidad de su sistema.

Células QA

Célula que orienta y guía al equipo a cumplir con los estándares requeridos utilizando las herramientas necesarias. Modalidad de célula completa o sólo un líder de célula.