Packs de interface

Aqua Kit de navegação

15 componentes de navegação e entrada (cartoon) para interfaces em modo escuro — azul-petróleo profundo, acento azul gelo. SVG e PNG transparente em 1x/2x/4x.

  • ui
  • svg
  • png transparente
  • abas
  • barra de rolagem
  • menu suspenso
  • menu de configurações
  • cartoon
  • cartoon
  • vidro
  • submerso
  • interface escura
  • ficção científica
Folha com 15 componentes de navegação e entrada (cartoon) da família Aqua, dispostos sobre um xadrez de transparência com suas medidas em pixels escritas embaixo
prévia 1600×1528a transparência aparece como xadrez

Sobre este pack

Aqua Kit de navegação é um conjunto de 15 componentes de navegação e entrada desenhados no estilo cartoon, em que um contorno grosso e limpo envolve uma face brilhante com um único faísca. Contém abas ativas e inativas, o trilho de uma barra de rolagem, sua alça e duas setas, um menu suspenso fechado e aberto com sua lista, campos de texto em repouso e com foco e botões redondos de fechar, voltar, mais e menos.

A maioria dos kits de interface gratuitos para em painéis e botões, o que significa que a primeira tela de configurações que você montar é o momento em que começa a desenhar arte própria. Isto é todo o resto: as peças de que um menu realmente precisa antes de funcionar.

O brilho é uma divisão de borda dura a 44% da altura, não um degradê suave: um esmaecimento suave se lê como vidro, uma divisão dura se lê como desenho. A sombra deslocada é maciça em vez de desfocada pelo mesmo motivo.

Dentro desse estilo, esta é a leitura Aqua: uma interface em modo escuro sobre uma paleta azul-petróleo profundo com acentos azul gelo, construída em torno de uma moldura de borda única, botões de cantos retos de 128x40, barras brilhantes divididas em 10 segmentos e ícones com contorno numa grade de 24px. São essas medidas que explicam por que duas famílias podem compartilhar um estilo artístico sem serem intercambiáveis: o estilo decide como se traça uma borda, os números decidem para que serve a interface.

O campo de texto com foco alarga o próprio contorno em vez de só mudar de cor, porque um anel de foco que é apenas um matiz some em modo de alto contraste e leva junto a navegação por teclado. A aba ativa se funde à superfície abaixo em vez de apenas clarear, e é isso que a faz se ler como conectada.

Cada sprite vem como SVG editável e como PNG transparente em 1x, 2x e 4x, então você pode jogar os PNGs direto num motor ou abrir o vetor e mudar uma cor. Desenhado com as mesmas medidas do resto da família Aqua, o que significa que este kit e o kit de painéis Aqua se alinham sem que nenhum dos dois seja redimensionado. Combina bem com jogos de anime e cartoon.

Download

Link direto · sem cadastro · sem página de espera
Baixar ZIP79 kB

Conjunto completo — fontes SVG, exportações PNG em 1x/2x/4x, licença e readme

Arquivos inclusos neste pack
ArquivoFormatoPesoDownload
Conjunto completo — fontes SVG, exportações PNG em 1x/2x/4x, licença e readmeZIP79 kB Obter →
Aba de navegação, ativa, cartoon, SVG editávelSVG1.1 kB Obter →

Como usar

  1. Aplique nine-slice ao trilho da barra de rolagem só na vertical; a alça é um sprite separado, então você pode dimensioná-la conforme a proporção do conteúdo sem esticar suas linhas de pega.
  2. O menu suspenso é um sprite separado do controle fechado — desenhe-o numa camada acima de tudo o mais, ou ele será recortado dentro do painel que o contém.
  3. Use os botões redondos de mais e menos como um par de incremento do mesmo tamanho do botão de fechar, para que uma linha de configurações mantenha um único ritmo.

Licença

Creative Commons Atribuição 4.0 — Grátis para uso comercial. Atribuição obrigatória. Termos completos · O que isso significa na prática

Linha de crédito para copiar
"Aqua Kit de navegação" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/aqua-navigation-kit