Titulagens

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H1

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H2

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H3

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H4

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H5
Tipografia Moderna e Futurismo/ Ação e Perspectiva - H6

Texto e Imagens

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente - H1

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H2

Imagem com figura abstrata.
Imagem abstrata. Original por Vinicius Braga

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H3

Imagem com figura abstrata.
Imagem com figura abstrata.

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Tipografia Moderna e Futurismo/ Ação e Perspectiva - H4

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Exemplo de texto preformatado:

My favorite search engine is [Duck Duck Go](https://duckduckgo.com "The best search engine for privacy").

Exemplo de texto preformatado com o tag code:

h4 {
    font-size: 2.3em;
    line-height: $basal-leading;
    min-height: $basal-leading * 2;
    padding: 35px 0 25px;
}
My favorite search engine is [Duck Duck Go](https://duckduckgo.com "The best search engine for privacy").
Tipografia Moderna e Futurismo/ Ação e Perspectiva - H5
Imagem com figura abstrata.
Imagem com figura abstrata.

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

  • Exemplo de lista;
  • Exemplo de lista;
  • Exemplo de lista.

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

  1. Exemplo de lista
  2. Exemplo de lista
  3. Exemplo de lista

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Exemplo de título de definição
Exemplo de descrição de definição
Exemplo de título de definição
Exemplo de descrição de definição

Na maioria dos casos, uma composição tipográfica deve ser especialmente legível e visualmente envolvente, sem desconsiderar o contexto em que é lido e os objetivos da sua publicação. Em trabalhos de design gráfico experimental (ou de vanguarda) os objetivos formais extrapolam a funcionalidade do texto, portanto questões como legibilidade, nesses casos, podem acabar sendo relativas.

Implementação de Tabelas
Pergunta Exemplo
Country BR
State RJ
Location Rio de Janeiro
Organization Vinicius Braga Studio
Organizational Unit Web Desenvolvimento
Common Name localhost

Os textos sobre tipografia são da Wikipedia.

Imagem com figura abstrata.
Imagem abstrata. Original por Vinicius Braga

Imagem abstrata

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H1

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H2

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

  • Exemplo de lista;
  • Exemplo de lista;
  • Exemplo de lista.

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

  1. Exemplo de lista
  2. Exemplo de lista
  3. Exemplo de lista

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H3

Tipografia Moderna - H4

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H5

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H6

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H1

Tipografia Moderna - H2

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Tipografia Moderna - H2

O conhecimento adequado do uso da tipografia é essencial aos designers que trabalham com diagramação, ou seja, na relação de texto e imagem. Logo a tipografia é um dos pilares do design gráfico e uma matéria necessária aos cursos de design. Para o designer que se especializa nessa área, a tipografia costuma se revelar um dos aspectos mais complexos e sofisticados do design gráfico.

Menu Horizontal

Menu no Header e com Busca

Este exemplo é de uso do menu no Header do site e aplicando a Busca como último item do Menu. Também tem um exemplo de item do menu selecionado e seu sub-item.

Menu horizontal de uso normal

Formulários

Campos de Texto

Telefone
Estado Civil
Opções com Checkbox

ou Cancelar

Erros no Formulário

Erro abaixo do campo

  • Este campo é obrigatório.

Erro entre o label e o campo

  • Este campo é obrigatório.
  • Um exemplo de uma segunda ou mais linhas de erro no mesmo campo.

Erros com múltiplos campos de texto organizados num Fieldset

Telefone
  • Este campo é obrigatório.
  • Um exemplo de uma segunda ou mais linhas de erro no mesmo campo.

Erros com Fieldset e Radios

Estado Civil
  • É preciso escolher uma opção abaixo.

Erros agregados no topo do formulário

O fomulário contêm erros nos campos, são eles:

Nome Completo
Este campo é obrigatório.
Email
Este campo é obrigatório.
Um exemplo de uma segunda ou mais linhas de erro no mesmo campo.

Botões

Botões com etiqueta simples de âncora.

btn-basic

btn-green btn-blue btn-orange btn-red

Classes específicas para compensar visualmente a posição de ícones nos botões.

Página Anterior Próxima Página

Exemplos com etiqueta de <submit> e <button>.

ou Cancelar