Template de site

Berry Free MUI React Admin Template

Versão gratuita do Berry, um painel administrativo responsivo moderno em React com Material-UI, projetado com componentes flexíveis

Painel · Grátis

Abrir demonstração Ver repositório do código

Páginas

Capturas da demonstração, página por página. Role dentro de cada página para vê-la inteira.

Template de site Berry Free MUI React Admin Template, página /free/, parte 1 — /free/Berry - React Material Free Admin Dashboard Template

Template de site Berry Free MUI React Admin Template, página /free/dashboard/default, parte 1 — /free/dashboard/defaultBerry - React Material Free Admin Dashboard Template

Template de site Berry Free MUI React Admin Template, página /free/sample-page, parte 1 — /free/sample-pageBerry - React Material Free Admin Dashboard Template

Template de site Berry Free MUI React Admin Template, página /free/typography, parte 1 — /free/typographyBerry - React Material Free Admin Dashboard Template

Análise do design

Uma leitura feita por IA do design deste template: cores, tipografia, espaçamento, seções e detalhes marcantes. O Ottermind parte dela quando você usa o template.

Visão geral: painel de administração, moderno, densidade média, claro
Paleta: fundo #ffffff; superfícies [#e3f2fd, #1e88e5, #5e35b1, #ede7f6]; texto #121926; texto suavizado #364152; primário #673ab7; destaques [#2196f3, #1e88e5, #5e35b1]
Tipografia: títulos Roboto, 500, caixa de frase; corpo Roboto, 14px; escala h3 20px
Forma e espaçamento: raio de botão/cartão 8px/27px, sem bordas, sombras suaves, espaçamento entre seções 24px, largura do conteúdo 1200px
Seções (de cima para baixo): Cabeçalho — layout horizontal, logotipo à esquerda, barra de pesquisa centralizada, avatar do usuário e ícones à direita, fundo branco
Barra lateral — navegação vertical com rótulos de ícones, estado recolhido exibido, fundo cinza-claro, item ativo destacado em roxo
Conteúdo principal — layout em grade com três cartões superiores (roxo, azul, azul), gráfico de barras empilhadas abaixo, lista de ações populares à direita, todos os cartões com cantos arredondados e sombra sutil
Rodapé — texto pequeno na parte inferior, direitos autorais e links, fundo cinza-claro
Detalhes marcantes: Cartões preenchidos com gradiente e padrões abstratos de ondas
Botão de ação flutuante com ícone de engrenagem em círculo roxo
Gráfico de barras empilhadas com segmentos codificados por cor (investimento, perda, lucro, manutenção)
Barra de progresso com rótulo percentual na barra lateral
Estados de passagem do mouse sobre itens de navegação com destaque roxo
Uso consistente de cantos arredondados em todos os componentes
Outras páginas: /free/dashboard/default: Visualização do painel com cartões de métricas, gráfico de crescimento e lista de ações
/free/sample-page: Layout mínimo de cartões com texto de espaço reservado e conteúdo de exemplo

Detalhes do template

Categoria: Painel
Autor: codedthemes
Publicado em: 21st.dev
Preço: Grátis

Dashboard
Admin Panel

Design original de codedthemes, publicado no 21st.dev. O Ottermind não copia o código do template: ele cria um site novo a partir do briefing.

O briefing de onde o Ottermind parte

Ele abre no Studio como rascunho — acrescente sua marca, público e páginas antes de enviar.

Construa um site de dashboard inspirado no modelo "Berry Free MUI React Admin Template". Brief de referência: Versão gratuita do Berry, um painel administrativo responsivo moderno em React com Material-UI, projetado com componentes flexíveis Estilo e funcionalidades a refletir: Painel Administrativo. Use o conteúdo original da minha marca — não os textos e imagens de exemplo do modelo.

Como usar este template

1
Clique em “Usar este template” para abri-lo no Ottermind Studio com o briefing preenchido.
2
Acrescente ao briefing sua marca, público, páginas e conteúdo.
3
O Ottermind cria um site novo inspirado neste design — continue ajustando pelo chat.