Flet: Page, o container principal

Posted on 18/07/202304/09/2023 by Guilherme Silva

Flet, Layout: Page

O objeto page é o primeiro conteiner na construção da árvore de controles do Flet, sendo o único que não está ligado a um conteiner pai. Ele contém o objeto View que, por sua vez abriga todos os outros controles. Uma instância de page e uma view primária são criadas automaticamente quando uma sessão é iniciada.

Exibir todos as propriedades, métodos e eventos →

Vamos primeiro fazer uma descrição dessas propriedades, métodos e eventos, e depois mostrar exemplos de uso. Muitas vezes a mera descrição do elemento é suficiente para que as apliquemos no código. Em alguns casos notas adicionais estão linkadas.

Propriedades de page

Observação: Os itens marcados com o ícone tem disponibilidade restrita:

🌎 só disponíveis na Web,
🖥️ só disponíveis no desktop,
📱 só disponíveis em celulares,

📝 há nota explicativa sobre o controle, (clique)
🅾 Read Only (Somente leitura).

Propriedade	Descrição
`auto_scroll`	True se a barra de scroll deve ser automaticamente posicionada no final se seu filho é atualizado. Necessariamente `auto_scroll = False` para que o método `scroll_to()` funcione.
`appbar`	`page.appbar` recebe uma barra de controle do aplicativo no alto da `page` (diferente da barra da janela).
`banner`	Controle `Banner` no alto da página.
`bgcolor`	Cor de fundo da página.
`client_ip`	🌎 Endereço de IP do usuário conectado.
`client_user_agent`	🌎 Detalhes do navegador do usuário conectado.
`controls`	📝 Lista de controles a exigir na página. Ex.: `page.controls.append(ft.Text("Olá!")); page.update()` é o mesmo que `page.add(ft.Text("Olá!"))`. Para remover o último controle da página: `page.controls.pop(); page.update()`.
`dark_theme`	Indica a instância do tema usado.
`dialog`	Um controle `AlertDialog` para ser exibido.
`floating_action_button`	Um controle `FloatingActionButton` para exibir no alto da página.
`fonts`	📝 Importa fontes para uso em `Text.font_family` ou aplica fonte no aplicativo inteiro com `theme.font_family`. Flet admite o uso de fontes `.ttc, .ttf, .otf`.
`height`	🅾 Altura da página, geralmente usada junto com o evento `page.on_resize`.
`horizontal_alignment`	📝 Alinhamento horizontal do controle filho em relação a seu conteiner.
`on_scroll_interval`	Passos em milisegundo para o evento `on_scroll event`. Default é 10.
`overlay`	Lista de controles exibidos em pilha sobre o conteúdo da página.
`padding`	Espaço entre as bordas do controle e as do conteiner. Default é `page.padding = 10`.
`platform`	Sistema operacional onde o aplicativo está sendo executado. Pode ser: ios, android, macos, linux ou, windows.
`pubsub`	Implementação para transferência de mensagens entre sessões do aplicativo.
`subscribe(handler)`	Registra a sessão atual para emissão de mensagens. `handler` é uma função ou método contendo uma mensagem.
`subscribe_topic(topic, handler)`	Inscreve a sessão para recebimento de mensagens sobre tópico específico.
`send_all(message)`	Envia mensagem a todos os inscritos.
`send_all_on_topic(topic, message)`	Envia mensagem para todos os inscritos em um tópico específico.
`send_others(message)`	Envia mensagem para todos, exceto para quem envia.
`send_others_on_topic(topic, message)`	Envia mensagem para todos em um tópico específico, exceto para quem envia.
`unsubscribe()`	Remove inscrição da sessão atual de todas as mensagens enviadas.
`unsubscribe_topic(topic)`	Remove inscrição da sessão de todas as mensagens sobre o tópico.
`unsubscribe_all()`	Remove as inscrições da sessão de todas as mensagens.
	📝 Sobre subscribe, unsubscribe e send.
`pwa`	🅾 `pwa=True` se o aplicativo está rodando como um Progressive Web App (PWA).
`route`	Define ou lê a rota de navegação da página
`rtl`	`rtl=True` para definir direção de texto da direita para esquerda. Default: False.
`scroll`	Permite rolagem vertical da página para evitar overflow.
`session_id`	🅾 ID único da sessão do usuário.
`spacing`	Espaço vertical entre controles na página. Default: 10 pixeis. Só é aplicado quando o `alignment=start, end ou center`.
`splash`	📝 Um controle que é exibido sobre o conteúdo da página. Operações lentas podem ser indicadas por meio de um `ProgressBar` ou `ProgressRing`.
`show_semantics_debugger`	True para a exibição de informações emitidas pelo framework.
`theme`	📝 Essa propriedade recebe uma instância de `theme.Theme` para personalizar o tema.
`ColorScheme class`	Um conjunto de 30 cores para configuração de cores dos componentes.
`TextTheme class`	Personalização de estilo de textos.
`ScrollbarTheme class`	Personalização de cor, espessura, forma da barra de scroll.
`TabsTheme class`	Personalização da aparência de controles de TAB.
`Navigation transitions`	Personalização das transições entre páginas de navegação.
`theme_mode`	Tema da página: SYSTEM (default), LIGHT ou DARK
`title`	Título da página ou do navegador.
`vertical_alignment`	📝 Alinhamento vertical do filho.
`views`	Uma lista de controles `View` para armazenar histórico de navegação. A última `View` é a página atual, a primeira é “root”, que não pode ser excluída.
`web`	True se a aplicativo está rodando no navegador.
`width`	🅾 Largura da página web ou janela de aplicativo, usualmente usada com o evento `page.on_resize`.
`window_always_on_top`	🖥️ Ajusta de a janela deve estar sempre acima das demais janelas. Default: False.
`window_bgcolor`	🖥️ Cor de fundo da janela do aplicativo.Pode ser usado com `page.bgcolor` para tornar a hjanela toda transparente.
`window_focused`	🖥️ True para trazer o foco para essa janela.
`window_frameless`	🖥️ True para eliminar as bordas das janelas.
`window_full_screen`	🖥️ True para usar tela cheia. Default: False.
`window_height`	🖥️ Leitura ou ajuste da altura da janela.
`window_left`	🖥️ Leitura ou ajuste da posição horizontal da janela, em relação à borda esquerda da tela.
`window_maximizable`	🖥️ False para ocultar botões de “Maximizar”. Default: True.
`window_maximized`	🖥️ True se a janela do aplicativo está maximizada. Pode ser ajustada programaticamente.
`window_max_height`	🖥️ Leitura ou ajuste da altura máxima da janela do aplicativo.
`window_max_width`	🖥️ Leitura ou ajuste da largura máxima da janela do aplicativo.
`window_minimizable`	🖥️ Se False o botão de “Minimizar” fica oculto. Default: True.
`window_minimized`	🖥️ True se a janela está minimizada. Pode ser ajustada programaticamente.
`window_min_height`	🖥️ Leitura ou ajuste da altura mínima da janela do aplicativo.
`window_min_width`	🖥️ Leitura ou ajuste da largura mínima da janela do aplicativo.
`window_movable`	🖥️ macOS apenas. Se False impede a movimentação da janela. Default: True.
`window_opacity`	🖥️ Ajuste da opacidade da janela. 0.0 (transparente) and 1.0 (opaca).
`window_resizable`	🖥️ Marque como False para impedir redimensionamento da janela. Default: True.
`window_title_bar_hidden`	🖥️ True para ocultar a barra de título da janela. O controle `WindowDragArea` permite a movimentação de janelas de barra de título.
`window_title_bar_buttons_hidden`	🖥️ apenas macOS. True para ocultar butões de ação da janela quando a barra de título está invisível.
`window_top`	🖥️ Leitura ou ajuste da posição da distância da janela (em pixeis) ao alto da tela.
`window_prevent_close`	🖥️ True para interceptar o sinal nativo de fechamente de janela. Pode ser usado com `page.on_window_event` ou `page.window_destroy()` para forçar uma confirmação do usuário.
`window_progress_bar`	🖥️ Exibe uma barra de progresso com valor de 0.0 a 1.0 na barra de tarefas (Windows) ou Dock (macOS).
`window_skip_task_bar`	🖥️ True para ocultar a barra de tarefas (Windows) ou Dock (macOS).
`window_visible`	🖥️ True para tornar o aplicativo visível. Usado quando o app é iniciado em janela oculta.
`window_width`	🖥️ Leitura ou ajuste da largura da janela do aplicativo.

Métodos de page

Método	Ação
`can_launch_url(url)`	📝 Verifica se a url pode ser acessada pelo aplicativo.
`close_banner()`	Fecha o banner ativo.
`close_bottom_sheet()`	Fecha o pé de página.
`close_dialog()`	Fecha a caixa de diálogo ativa.
`close_in_app_web_view()`	📱 Fecha visualização de página web iniciada com `launch_url()` de dentro do aplicativo.
`get_clipboard()`	Recupera o último texto salvo no clipboard do lado do cliente.
`go(route)`	Um método auxiliar para atualizar `page.route`. Ele aciona o evento `page.on_route_change` seguido de `page.update()`.
`launch_url(url)`	📝 Abre uma URL em nova janela do navegador.
`page.get_upload_url(file_name, expires)`	Gera URL para armazenamento de upload.
`scroll_to(offset, delta, key, duration, curve)`	Move a posição de scroll para local absoluto ou incremento relativo. Detalhes em scroll_to.
`set_clipboard(data)`	Insere conteúdo no clipboard do lado do cliente (navegador ou desktop). Ex.: `page.set_clipboard("Esse valor vai para o clipboard")`.
`show_banner(banner: Banner)`	Exibe um `Banner` no pé de página.
`show_bottom_sheet(bottom_sheet: BottomSheet)`	Exibe um `BottomSheet` no pé de página.
`show_dialog(dialog: AlertDialog)`	Exibe caixa de diálogo.
`show_snack_bar(snack_bar: SnackBar)`	Exibe um `SnackBar` no pé de página.
`window_center()`	🖥️ Move a janela do aplicativo para o centro da tela.
`window_close()`	🖥️ Fecha a janela do aplicativo.
`window_destroy()`	🖥️ Força o fechamento da janela. Pode ser usado com `page.window_prevent_close = True` para exigir a confirmação do usuário para encerramento do aplicativo. 📝
`window_to_front()`	🖥️ Traz a janela do aplicativo para o primeiro plano.

Eventos de page

Evento	Dispara quando
`on_close`	uma sessão expirou por um tempo configurado. Default: 60 minutos.
`on_connect`	o usuário da web conecta ou reconect uma sessão. Não dispara na primeira exibição de uma página mas quando ela é atualizada. Detecta a presença do usuário online.
`on_disconnect`	o usuário se desconecta de uma sessão, fechando o navegador ou a aba da página.`on_error` ocorre um erro não tratado.
`on_keyboard_event`	📝 uma tecla é pressionada.
`on_resize`	📝 a janela do aplicativo ou navegador é redimensionada.
`on_route_change`	a rota da página é alterada no código, pela alteração da URL no navegador ou uso dos botões de avançar ou retroceder.
`on_scroll`	a posição de scroll é alterada pelo usuário. Tem mesmo comportamento de `Column.on_scroll`.
`on_view_pop`	📝 o usuário clique o botão de “retornar” em um controle `AppBar`.
`on_window_event`	📝 a janela do aplicativo muda de estado: posição, tamanho, maximizado, minimizado, etc.

Bibiografia

Python com Flet: Bibiografia Geral
Flet Controls Galery: Galeria de Controles: Buttons
Galeria de ícones: Icons Browser
GitHub: Controls Galery: Galeria de Controles: Código

Notas sobre o Objeto Page
Objetos View e Controler

Flet: Botões

Posted on 14/07/202301/09/2023 by Guilherme Silva

Todos os tópicos →

Widgets, propriedades e eventos

Estritamente dizendo deveríamos iniciar nosso estudo do Flet considerando os objetos mais básicos, no sentido de serem containeres de outros objetos. No entanto já vimos vários casos de pequenos aplicativos que usam botões. É difícil sequer exibir exemplos de código de GUI sem botões. Por isso vamos descrever aqui o uso dos botões, deixando para depois uma descrição dos controles de layout.

Alguns controles tem a função principal de obter informações do usuário, como botões, menus dropdown ou caixas de texto, para inserção de dados. Outros servem para a exibição de informações calculadas pelo código, mostrando gráficos, figuras ou textos. As caixas de textos podem ser usadas em ambos os casos.

Buttons (botões)

Os seguintes tipos de botões estão disponíveis (e ilustrados na figura 1), contendo as propriedades, métodos e respondendo a eventos:

Botões
ElevatedButton FilledButton
FilledTonalButton
FloatingActionButton
IconButton OutlinedButton
PopupMenuButton TextButton Propriedades
autofocus, bgcolor,
data, color, content,
elevation, icon, icon_color,
style, text, tooltip,
url, url_target Eventos
on_blur,
on_click,
on_focus,
on_hover,
on_long_press Método
focus()

Vamos usar alguns exemplos para ilustrar as propriedades e métodos desses objetos.

import flet as ft

def main(page: ft.Page):
    def mudar(e):
        bt2.disabled = not bt2.disabled
        bt2.text = "Desabilitado" if bt2.disabled else "Habilitado" 
        page.update()

    bt1 = ft.FilledButton(text="FilledButton", on_click=mudar, width=200)
    bt2 = ft.ElevatedButton("Habilitado", disabled=False, width=200)
    page.add(bt1, bt2)

ft.app(target=main)

Nesse caso um FilledButton aciona a função mudar que alterna a propriedade disabled do botão elevado. Observe que um botão com disabled=True não reage ao clique, nem à nenhum outro evento. O operador ternário foi usado: valor_se_true if condicao else valor_se_false.

Dois novos eventos são mostrados a seguir: on_hover, que é disparado quando o cursor se move sobre o botão (sem necessidade de clicar) e on_long_press, disparado com um clique longo. Um ícone é inserido nos botões ElevatedButton, cujas cores são alteradas pelos eventos descritos.

import flet as ft

def main(page: ft.Page):

    def azular(e):
        bt2.icon_color="blue"
        page.update()

    def vermelho(e):
        bt2.icon_color="red"
        page.update()

    bt1 = ft.ElevatedButton("Tornar azul", icon="chair_outlined", on_hover= azular, width=250)
    bt2 = ft.ElevatedButton("Tornar Vermelho", icon="park_rounded", on_long_press=vermelho, icon_color= "green", width=250)
    page.add(bt1, bt2)

ft.app(target=main)

Os botões assumem os estados mostrados na figura 2.

Uma grande quantidade de ícones está disponível e pode ser pesquisada em Flet.dev: Icons Browser.

Botões possuem a propriedade data que pode armazenar um objeto a ser passado para as funções acionadas por eventos. As propriedades dos widgets funcionam como variáveis globais. No exemplo abaixo temos uma caixa de texto, que exibe a propriedade data. O botão elevado também tem uma propridade data que não é exibida mas serve para armazenar quantas vezes o botão foi clicado. Ele serve de container para um Row contendo 3 ícones (ft.Icon(ft.icons.NOME_DO_ICONE)).

import flet as ft

def main(page: ft.Page):
    def bt_clicou(e):
        bt.data += 1
        txt.value = f"O botão foi clicado {bt.data} {'vezes' if bt.data >1 else 'vêz'}"
        page.update()

    txt = ft.Text("O botão não foi clicado", size=25, color="navyblue", italic=True)
    bt = ft.ElevatedButton("Clica!",
            content=ft.Row(
                [
                    ft.Icon(ft.icons.CHAIR, color="red"),
                    ft.Icon(ft.icons.COTTAGE, color="green"),
                    ft.Icon(ft.icons.AGRICULTURE, color="blue"),
                ],  alignment=ft.MainAxisAlignment.SPACE_AROUND,),
                    on_click=bt_clicou, data=0, width=150,
         )
    page.add(txt, bt)

ft.app(target=main)

Se o nome do ícone não for fornecido como primeiro parâmetro o nome do parâmetro deve ser nomeado: ft.Icon(color="red", name=ft.icons.CHAIR). E execução do código resulta nas janelas exibidas na figura 3.

As caixas de texto podem receber formatações diversas como size (tamanho da fonte), color (cor da fonte) bgcolor (cor do fundo), italic (itálico), weight (peso da fonte). A propriedade selectable informa se o texto exibido pode ser selecionado, e estilos diversos podem ser atribuídos em style. A página recebe a propriedade page.scroll = "adaptive" para que possa apresentar uma barra de scroll.

import flet as ft

def main(page: ft.Page):
    page.scroll = "adaptive"

    t1 = ft.Text("Tamanho 12 (Size 12)", size=12)
    t2 = ft.Text("Tamanho 20, Italic", size=32, color="red", italic=True)
    t3 = ft.Text("Tamanho 30, peso 100", size=30, color=ft.colors.WHITE,
                  bgcolor=ft.colors.BLUE_600, weight=ft.FontWeight.W_100)
    t4 = ft.Text(
            "Size 40, Normal",
            size=40,
            color=ft.colors.WHITE,
            bgcolor=ft.colors.ORANGE_800,
            weight=ft.FontWeight.NORMAL
        )
    t5 = ft.Text(
            "Size 30, Bold, Italic",
            size=30,
            color=ft.colors.WHITE,
            bgcolor=ft.colors.GREEN_700,
            weight=ft.FontWeight.BOLD,
            italic=True
        )
    t6 = ft.Text("Size 20, w900, selecionável", size=20, weight=ft.FontWeight.W_900, selectable=True)

    page.add(t1, t2, t3, t4, t5, t6) 

ft.app(target=main)

O resultado é mostrado na figura 4. A janela foi dimensionada para ser menor que o texto existente, mostrando a barra de scroll.

O número máximo de linhas exibidas, max_lines, ou largura e altura do texto, width e height são úteis quando se apresenta texto logo em uma janela.

import flet as ft

def main(page: ft.Page):
    page.scroll = "adaptive"
    
    texto1 = (
        "René Descartes (La Haye en Touraine, 31 de março de 1596, Estocolmo, 11 de"
        "fevereiro de 1650) foi um filósofo, físico e matemático francês. Durante a"
        "Idade Moderna, também era conhecido por seu nome latino Renatus Cartesius."
    )
    texto2 = (
        "Descartes, por vezes chamado de o fundador da filosofia moderna e o pai da"
        "matemática moderna, é considerado um dos pensadores mais importantes e"
        "influentes da História do Pensamento Ocidental. Inspirou contemporâneos e"
        "várias gerações de filósofos posteriores; boa parte da filosofia escrita "
        "a partir de então foi uma reação às suas obras ou a autores supostamente"
        "influenciados por ele. Muitos especialistas afirmam que, a partir de"
        "Descartes, inaugurou-se o racionalismo da Idade Moderna."
    )

    t7 = ft.Text("Limita texto longo a 1 linha, com elipses", style=ft.TextThemeStyle.HEADLINE_SMALL)
    t8 = ft.Text(texto1, max_lines=1, overflow="ellipsis")
    t9 = ft.Text("Limita texto longo a 2 linhas", style=ft.TextThemeStyle.HEADLINE_SMALL)
    t10 = ft.Text(texto2, max_lines=2)
    t11 = ft.Text("Limita largura e altura do texto longo", style=ft.TextThemeStyle.HEADLINE_SMALL)
    t12 = ft.Text(texto2, width=700, height=100)

    page.add(t7, t8, t9, t10, t11, t12)

ft.app(target=main)

Resultando na janela mostrada na figura 5. O parâmetro overflow="ellipsis" mostra uma elipses onde on texto foi quebrado. As definições de texto1 e texto2 correspondem a uma das formas de declarar strings longas no python.

Existem estilos pré-definidos. código abaixo usamos o texto do widget igual ao nome do estilo, para facilitar a visualização: style=ft.TextThemeStyle.NOME_DO_ESTILO. Apenas as definições estão mostradas e o resultado está na figura 6.

    page.add(
        ft.Text("DISPLAY_LARGE",   style=ft.TextThemeStyle.DISPLAY_LARGE),
        ft.Text("DISPLAY_MEDIUM",  style=ft.TextThemeStyle.DISPLAY_MEDIUM),
        ft.Text("DISPLAY_SMALL",   style=ft.TextThemeStyle.DISPLAY_SMALL),
        ft.Text("HEADLINE_LARGE",  style=ft.TextThemeStyle.HEADLINE_LARGE),
        ft.Text("HEADLINE_MEDIUM", style=ft.TextThemeStyle.HEADLINE_MEDIUM),
        ft.Text("HEADLINE_MEDIUM", style=ft.TextThemeStyle.HEADLINE_MEDIUM),
        ft.Text("TITLE_LARGE",     style=ft.TextThemeStyle.TITLE_LARGE),
        ft.Text("TITLE_MEDIUM",    style=ft.TextThemeStyle.TITLE_MEDIUM),
        ft.Text("TITLE_SMALL",     style=ft.TextThemeStyle.TITLE_SMALL),
        ft.Text("LABEL_LARGE",     style=ft.TextThemeStyle.LABEL_LARGE),
        ft.Text("LABEL_MEDIUM",    style=ft.TextThemeStyle.LABEL_MEDIUM),
        ft.Text("LABEL_SMALL",     style=ft.TextThemeStyle.LABEL_SMALL),
        ft.Text("BODY_LARGE",      style=ft.TextThemeStyle.BODY_LARGE),
        ft.Text("BODY_MEDIUM",     style=ft.TextThemeStyle.BODY_MEDIUM),
        ft.Text("BODY_SMALL",      style=ft.TextThemeStyle.BODY_SMALL)
    )

Propriedades dos controles pode ser alterados dinamicamente por meio de inputs recebidos do usuário (ou outra origem qualquer). No próximo exemplo o tamanho da fonte é controlado por um flet.Slider.

import flet as ft
def main(page: ft.Page):
    def font_size(e):
        t.size = int(sl.value)
        t.value = f"Texto escrito com fonte Bookerly, size={t.size}"
        t.update()

    t = ft.Text("Texto escrito com fonte Bookerly, size=10", size=10, font_family="Bookerly")
    sl = ft.Slider(min=0, max=100, divisions=10, value=10, label="{value}", width=500, on_change=font_size)

    page.add(t, sl)

ft.app(target=main)

O app gerado está na figura 7. Observe que a propriedade do Slider.label="value" exibe acima do cursor (como um tooltip) o valor do controle. O tamanho da fonte é ajustado de acordo com esse valor.

Se a fonte está instalada localmente basta usar font_family="Nome_da_Fonte". Para fontes remotas podemos definir uma ou várias fontes a serem usadas. page.fonts recebe um dicionário com nomes e locais das fontes.

    page.fonts = {
        "Kanit": "https://raw.githubusercontent.com/google/fonts/master/ofl/kanit/Kanit-Bold.ttf",
        "Open Sans": "fonts/OpenSans-Regular.ttf",
    }
    page.theme = Theme(font_family="Kanit")
    page.add(
        ft.Text("Esse texto é renderizado com fonte Kanit"),
        ft.Text("Esse texto é renderizado com fonte 'Open Sans'", font_family="Open Sans"),

Ícones

O objeto fleet.Icon pode ser inserido em vários conteineres. Ele possui as propriedades (entre outras) color, name, size e tooltip. O tamanho default é size=24 enquanto tooltip é o texto exibido quando o cursor está sobre o ícone.
O código ilustra esse uso:

import flet as ft

def main(page: ft.Page):
    ic1 = ft.Icon(name=ft.icons.ADD_HOME_ROUNDED, color=ft.colors.AMBER_900)
    ic2 = ft.Icon(name=ft.icons.ZOOM_IN, color=ft.colors.BLUE_ACCENT_700, size=30)
    ic3 = ft.Icon(name=ft.icons.AIR_SHARP, color="blue", size=50)
    ic4 = ft.Icon(name="child_care", color="#ffc1c1", size=70, tooltip="ajustes")
    page.add(ft.Row([ic1, ic2, ic3, ic4, ft.Image(src=f"img/Search.png")]))

ft.app(target=main)

Figura 8: Resultado do código de exibição de ícones.

O nome do ícone pode ser dado como name=ft.icons.ZOOM_IN ou uma string name="child_care", onde o nome pode ser pesquisado no Icons Browser. Note que ft.icons contém ENUMS predefinidos e name=ft.icons.AIR_SHARP é o mesmo que name="air_sharp".

Ícones personalizados podem ser inseridos como imagens, como em flet.Image(src=f"img/Search.png"), onde o caminho pode ser absoluto ou relativo, em referência ao diretório onde está o aplicativo. Isso significa que a imagem da lupa exibida na figura está armazenada em pasta_do_aplicativo/img/Search.png.

Bibiografia

Python com Flet: Bibiografia Geral
Flet Controls Galery: Galeria de Controles: Buttons
Galeria de ícones: Icons Browser
GitHub: Controls Galery: Galeria de Controles: Código

Flet: Objeto Page

Python com Flet: Widgets

Posted on 14/07/202301/09/2023 by Guilherme Silva

Todos os tópicos →

Widgets, propriedades e eventos

Vimos no primeiro artigo dessa série que um aplicativo Python com Flet consiste em código Python para a realização da lógica do aplicativo, usando o Flet como camada de exibição. Mais tarde nos preocuparemos em fazer uma separação explícita das camadas. Por enquanto basta notar que o Flet cria uma árvore de widgets cujas propriedades são controladas pelo código. Widgets também podem estar associados à ações ligadas a funções. Portanto, para construir aplicativos com Flet, precisamos conhecer esses widgets, suas propriedades e eventos que respondem.

Figura 10: Estrutura de árvore de um aplicativo Flet

A interface do Flet é montada como uma composição de controles, arranjados em uma hierarquia sob forma de árvore que se inicia com uma Page. Dentro dela são dispostos os demais controles, sendo que alguns deles são também conteineres, abrigando outros controles. Todos os controles, portanto, possuem um pai, exceto a Page. Controles como Column, Row e Dropdown podem conter controles filhos, como mostrado na figura 10.

Categorias de Controles

🔘 Controles	Categoria	Itens
🔘 Layout	diagramação	16 itens
🔘 Navigation	navegação	3 itens
🔘 Information Displays	exibição de informação	8 itens
🔘 Buttons	botões	8 itens
🔘 Input and Selections	entrada e seleções	6 itens
🔘 Dialogs, Alerts, Panels	dialogo e paineis	4 itens
🔘 Charts	gráficos	5 itens
🔘 Animations	animações	1 item
🔘 Utility	utilidades	13 itens

Propriedades comuns a vários controles

Algumas propriedades são comuns a todos (ou quase todos) os controles. Vamos primeiro listá-las e depois apresentar alguns exemplos de uso. As propriedades marcadas com o sinal ≜ só são válidas quando estão dentro de uma controle Stack, que será descrito após a tabela.

`bottom`	≜	Distância entre a borda inferior do filho e a borda inferior do `Stack`.
`data`		Um campo auxiliar de dados arbitrários que podem ser armazenados junto a um controle.
`disabled`		Desabilitação do controle. Por padrão `disabled = False`. Um controle desabilitado fica sombreado e não reage a nenhum evento. Todos os filhos de um controle desabilitado ficam desabilitados.
`expand`		Um controle dentro de uma coluna ou linha pode ser expandido para preencher o espaço disponível. `expand=valor`, onde `valor` pode ser booleano ou inteiro, um fator de expansão, usado para dividir o espaço entre vários controles.
`hight`		Altura do controle, em pixeis.
`left`	≜	Distância da borda esquerda do filho à borda esquerda do `Stack`.
`right`	≜	Distância da borda direita do filho à borda direita do `Stack`.
`top`	≜	Distância da borda superior do filho ao topo do `Stack`.
`visible`		Visibilidade do controle e seus filhos. `vivible = True` por padrão. Controles invisíveis não recebem foco, não podem ser selecionados nem respondem a eventos.
`widht`		Largura de controle em pixeis.

Um Stack é um controle usado para posicionar controles em cima de outros (empilhados). Veremos mais sobre ele na seção sobre layouts.

Transformações (Transformations)

Transformações são operações realizadas sobre os controles

`offset`	É uma translação aplicada sobre um controle, antes que ele seja renderizado. A translação é dada em uma escala relativa ao tamanho do controle. Um deslocamento de 0,25 realizará uma translação horizontal de 1/4 da largura do controle. Ex,: `ft.Container(..., offset=ft.transform.Offset(-1, -1)`.
`opacity`	Torna o controle parcialmente transparente. O default é `opacity=1.0`, nenhuma transparência. Se `opacity=0.0`controle é 100% transparente.
`rotate`	Aplica uma rotação no controle em torno de seu centro. O parâmetro `rotate` pode receber um número, que é interpretado com o ângulo, em radianos, de rotação anti-horária. A rotação também pode ser especificada por meio de `transform.Rotate`, que permite estabelecer ângulo, alinhamento e posição de centro de rotação. Ex,: `ft.Image(..., rotate=Rotate(angle=0.25 * pi, alignment=ft.alignment.center_left)` representa uma rotação de 45° (π/4).
`scale`	Controla a escala ao longo do plano 2D. O fator de escala padrão é 1,0. Por ex.: `ft.Image(..., scale=Scale(scale_x=2, scale_y=0.5)` multiplica as dimensões em `x` por 2 e em `y` por .5. Alternativamente `Scale(scale=3)` multiplica por 3 nas duas direções.

Exemplo de uso das Propriedades e Transformações

import flet as ft

def main(page: ft.Page):
    def mover_x(e):
        ct.left += 20
        page.update()

    def mover_y(e):
        ct.top += 20
        page.update()

    def mover(e):
        bt3.value += .2
        ct.offset=ft.transform.Offset(bt3.value, bt3.value)
        page.update()

    def sumir(e):
        ct.visible = not ct.visible
        page.update()

    def rodar(e):
        bt5.value+=.5
        ct.rotate=ft.Rotate(angle=bt5.value, alignment=ft.alignment.center)
        page.update()

    def opaco(e):
        ct.opacity -= .1
        page.update()

    def zerar(e):
        bt3.value=0
        bt5.value=0
        ct.left=0
        ct.top=0
        ct.offset=ft.transform.Offset(0, 0)
        ct.opacity = 1
        ct.visible = True
        ct.rotate=ft.Rotate(angle=0, alignment=ft.alignment.center)
        page.update()

    bt1 = ft.ElevatedButton(" ", icon="arrow_circle_right", on_click= mover_x, width=50)
    bt2 = ft.ElevatedButton(" ", icon="arrow_circle_down", on_click= mover_y, width=50)
    bt3 = ft.ElevatedButton(" ", icon="SUBDIRECTORY_ARROW_RIGHT", on_click= mover, width=50)
    bt3.value=0
    bt4 = ft.ElevatedButton("on/off", on_click= sumir, width=150)
    bt5 = ft.ElevatedButton("Rodar", on_click= rodar, width=150)
    bt5.value=0
    bt6 = ft.ElevatedButton("Opaco", on_click= opaco, width=150)
    bt7 = ft.ElevatedButton("Zerar", on_click= zerar, width=150)

    ct = ft.Container(bgcolor="red", width=50, height=50, left=0, top=0,
                      offset=ft.transform.Offset(0, 0))

    page.add(ft.Row([bt1, bt2, bt3, bt4, bt5, bt6, bt7]), ft.Stack([ct], width=1000, height=1000))

ft.app(target=main)

Os botões executam as funções:

bt1 ⇾ move para a direita, horizontalmente (ct.left += 20),
bt2 ⇾ move para baixo, na vertical (ct.top += 20),
bt3 ⇾ aumenta offset, nas duas direções (ct.offset=ft.transform.Offset(bt3.value, bt3.value)),
bt4 ⇾ torna a imagem invisível/visível (ct.visible = not ct.visible),
bt5 ⇾ gira imagem, anti-horário:
ct.rotate=ft.Rotate(angle=bt5.value, alignment=ft.alignment.center),
bt6 ⇾ torna a cor mais translúcida (ct.opacity -= .1),
bt7 ⇾ retorna a imagem para o estado inicial,

Figura 12: Propriedades e Transformações

onde ct = ft.Container, é o container de cor vermelha, mostrado no figura 12.

Atalhos de Teclado

Qualquer pessoa que faz uso intensivo do computador sabe da importância dos Atalhos de Teclado (Keyboard shortcuts). A possibilidade de não mover a mão do teclado para acionar o mouse pode significar melhor usabilidade e aumento de produtividade. Para isso o Flet oferece para o programador a possibilidade de inserir atalhos em seus aplicativos para que seu usuário possa dinamizar seu uso.

Para capturar eventos produzidos pelo teclado o objeto page implementa o método on_keyboard_event, que gerencia o pressionamento de teclas de caracter, em combinação com teclas de controle. Esse evento passa o parâmetro eque é uma instância da classe KeyboardEvent, e tem as seguintes propriedades:

`e.key`	Representação textual da tecla pressionada. Veja nota^†.
`e.shift`	Booleano: True se a tecla “Shift” foi pressionada.
`e.ctrl`	Booleano: True se a tecla “Control” foi pressionada.
`e.alt`	Booleano: True se a tecla “Alt” foi pressionada.
`e.meta`	Booleano: True se a tecla “Meta” foi pressionada^††.

Nota^†: Além dos caracteres A … Z (todos apresentados em maiúsculas) também são representadas as teclas Enter, Backspace, F1 … F12, Escape, Insert … Page Down, Pause, etc. Alguns teclados permitem a reconfiguração de teclas, por exemplo fazendo F1 = Help, etc.
Nota^††: A tecla Meta é representada em geral no Windows como tecla Windows e no Mac como tecla Command.

O seguinte código ilustra esse uso. A linha page.on_keyboard_event = on_teclado faz com que eventos de teclado acionem a função on_teclado. O objeto e leva as propriedades booleanas e.ctrl, e.alt, e.shift, e.meta e o texto e.key.

import flet as ft                                                          
                                                                            
def main(page: ft.Page):

    class BtControle(ft.TextField):
        def __init__(self, text):
            super().__init__()
            self.value = text
            self.width=100
            self.text_size=25
            self.bgcolor="blue"
            self.color="white"
            self.visible = False
            
    def on_teclado(e: ft.KeyboardEvent):
        c_ctrl.visible = e.ctrl
        c_alt.visible = e.alt
        c_shift.visible = e.shift
        c_meta.visible = e.meta
        c_key.visible = True
        c_key.value = e.key
        page.update()

    page.on_keyboard_event = on_teclado

    t1= ft.Text("Pressione qualquer tecla, combinada com \nCTRL, ALT, SHIFT ou META", size=25)
    c_ctrl = BtControle("Ctrl")
    c_alt = BtControle("Alt")
    c_shift = BtControle("Shift")
    c_meta = BtControle("Meta")
    c_key = BtControle("")

    page.add(t1)
    page.add(ft.Row(controls=[c_ctrl, c_alt, c_shift, c_meta, c_key]))

ft.app(target=main)

O resultado desse código, quando executado e após o pressionamento simultaneo das teclas CTRL-ALT-SHIFT-J, está mostrado na figura 13.

O exemplo acima ilustra ainda uma característica da POO (programação orientada a objetos). Como temos que criar 5 caixas de texto iguais, exceto pelo seu valor, criamos uma classe BtControle (herdando de ft.TextField) e criamos cada botão como instância dessa classe. No código manipulamos a visibilidade desses botões.

Bibiografia

Real Python:Python Classes: The Power of Object-Oriented Programming
Real Python:Supercharge Your Classes With Python super()
Python com Flet: Bibiografia Geral

Python com Flet: Botões

Python com Flet

Posted on 10/07/202331/08/2023 by Guilherme Silva

Todos os tópicos →

Flet: Flutter para Python

Baseado no Flutter (veja nota abaixo) foi desenvolvida a biblioteca Flet, um framework que permite a construção de aplicações web, desktop e mobile multiusuário interativas usando o Python. O Flet empacota os widgets do Flutter e adiciona algumas combinações próprias de widgets menores, ocultando complexidades e facilitando o uso de boas práticas de construção da interface do usuário. Ele pode ser usado para construir aplicativos que rodam do lado do servidor, eliminando a necessidade de uso de HTML, CSS e Javascrip, e também aplicativos para celulares e desktop. Seu uso exige o conhecimento prévio de Python e um pouco de POO (programação orientada a objetos).

Atualmente (em julho de 2023) o Flet está na versão 0.7.4 e em rápido processo de desenvolvimento.

Flutter e Widgets

Instalando o Flet

Para executar código do python com flet no Linux é necessário ter as bibliotecas do GStreamer instaladas, o que já ocorre na maioria das instalações. Se a mensagem de erro abaixo for emitida instale o GStreamer.

# mensagem de erro ao executar python com flet
error while loading shared libraries: libgstapp-1.0.so.0: cannot open shared object file: No such file or directory

# GStreamer pode ser instalado com (no fedora)
$ sudo dnf update
$ sudo dnf install libgstreamer1.0-dev libgstreamer-plugins-base1.0-dev libgstreamer-plugins-bad1.0-dev gstreamer1.0-plugins-base gstreamer1.0-plugins-good gstreamer1.0-plugins-bad gstreamer1.0-plugins-ugly gstreamer1.0-libav gstreamer1.0-doc gstreamer1.0-tools gstreamer1.0-x gstreamer1.0-alsa gstreamer1.0-gl gstreamer1.0-gtk3 gstreamer1.0-qt5 gstreamer1.0-pulseaudio

# no ubuntu
$ sudo apt-get update
$ sudo apt-get  (mesmo string acima)

Flet exige Python 3.7 ou superior. Para instalar o módulo podemos usar o pip. Como sempre, é recomendado (mas não obrigatório) instalar a nova biblioteca dentro de um ambiente virtual é recomendado (embora não obrigatório).

# criamos um ambiente virtual com o comando
$ python3 -m venv ~/Projetos/.venv
# para ativar o ambiente virtual
$ cd ~/Projetos/.venv
$ source bin/activate

# agora podemos instalar o flet
$ pip install flet

# para upgrade do flet, se já instalado
$ pip install flet --upgrade

Outras instruções de instalação podem ser encontradas na documentação do Flet, ou a instalação com Anaconda.

Feito isso podemos escrever nosso primeiro código flet, apenas com o esqueleto de um aplicativo. Ao ser executado ele apenas abre uma janela sem conteúdo. Abra um editor de texto, ou sua IDE preferida, e grave o seguinte arquivo, com nome flet1.py:

import flet as fl

def main(page: fl.Page):
    # add/update controls on Page
    pass

fl.app(target=main)

Ao executar python flet1.py veremos apenas uma janela vazia, que pode ser fechada com os controles usuais de janela (ou CTRL-F4). O programa termina com flet.app(target=main), recebendo no parâmetro target a função que apenas recebe o objeto fleet.Page, main (podia ter outro nome qualquer). O objeto Page é como um Canvas onde, mais tarde, inseriremos outros widgets.

Da forma como escrevemos esse código, uma janela nativa do sistema operacional será aberta no desktop. Para abrir o mesmo aplicativo no browser padrão trocamos a última linha por:

fl.app(target=main, view=fl.AppView.WEB_BROWSER)

Inserindo Widgets

Para obter alguma funcionalidade em nosso aplicativo temos que inserir nele controles, também chamados de widgets. Controles são inseridas na Page, o widget de nível mais alto, ou aninhados dentro de outros controles. Por exemplo, para inserir texto diretamente na page fazemos:

import flet as fl

def main(page= fl.Page):
    txt = fl.Text(value="Olá mundo!", color="blue")
    page.controls.append(txt)
    page.update()

fl.app(target=main)

Widgets são objetos do python com uma representação visual, com características controladas por seus parâmetros. value e color são parâmetros que recebem strings, esse último declarado no formato de cor do HTML. São válidas as cores, por exemplo: navyblue, #ff0000 (vermelho), etc. O objeto page possui uma lista controls, à qual adicionamos o elemento txt.

No código seguinte usamos um atalho: page.add(t) significa o mesmo que page.controls.append(t) seguido de page.update(). Também importamos o módulo time para provocar uma pausa na execução do código em time.sleep(1).

import flet as fl
import time

def main(page= fl.Page):
    t = fl.Text()
    page.add(t)
    cidades = ["Belo Horizonte","Curitiba","São Paulo","Salvador","** fim **"]
    for i in range(5):
        t.value = cidades[i]
        page.update()
        time.sleep(1)

fl.app(target=main)

Ao ser executado as quatro cidades armazenadas na lista cidades são exibidas e o loop é terminado com a exibição de ** fim **.

Alguns controles, como Row e Line são containers, podendo conter dentro deles outros widgets, da mesma forma que Page. Por exemplo, inicializamos abaixo uma linha (um objeto ft.Row) contendo três outros objetos que são strings, e a inserimos em page.

import flet as ft
import time

def main(page= ft.Page):
    linha = ft.Row(controls=[ft.Text("Estas são"), ft.Text("cidades"), ft.Text("brasileiras")])
    page.add(linha)
    t = ft.Text()
    page.add(t) # it's a shortcut for page.controls.append(t) and then page.update()
    cidades = ["Belo Horizonte","Curitiba","São Paulo","Salvador","** fim **"]
    for i in range(5):
        t.value = cidades[i]
        page.update()
        time.sleep(1)


ft.app(target=main)

O resultado é exibido na figura 1, com a cidade sendo substituída a cada momento.

Vemos que Row recebe no parâmetro controls uma lista com 3 widgets de texto.

Claro que muitos outros controles pode ser inseridos. Com o bloco abaixo podemos inserir um campo de texto, que pode ser editado pelo usuário, e um botão.

    page.add(
        ft.Row(controls=[
            ft.TextField(label="Sua cidade"),
            ft.ElevatedButton(text="Clique aqui para inserir o nome de sua cidade!")
        ])
    )

Podemos também criar novas entradas de texto e as inserir consecutivamente em page.

import flet as ft
import time

def main(page= ft.Page):
    page.add(
        ft.Row(controls=[
            ft.Text("Estas são"),
            ft.Text("cidades"),
            ft.Text("brasileiras")
        ])
    )
    page.add(
        ft.Row(controls=[
            ft.TextField(label="Sua cidade"),
            ft.ElevatedButton(text="Clique aqui para inserir o nome de sua cidade!")
        ])
    )
    cidades = ["Belo Horizonte","Curitiba","São Paulo","Salvador","** fim **"]
    for i in range(5):
        t = ft.Text()
        t.value = cidades[i]
        page.add(t)
        page.update()
        time.sleep(1)

ft.app(target=main)

Nesse caso não estamos substituindo o conteúdo de um objeto de texto fixo na página, e sim inserindo novas linhas (figura 2). Observe que nenhum procedimento foi designado a esse botão que, no momento, não executa nenhuma tarefa.

O comando page.update(), que pode estar embutido em page.add(), envia para a página renderizada apenas as alterações feitas desde sua última execução.

Para incluir alguma ação útil em nosso projeto usamos a capacidade de alguns controles de lidar com eventos (os chamados event handlers). Botões podem executar tarefas quando são clicados usando o evento on_click.

import flet as ft
def main(page: ft.Page):
    def button_clicked(e):
        page.add(ft.Text("Clicou"))
        
    page.add(ft.ElevatedButton(text="Clica aqui", on_click=button_clicked))

ft.app(target=main)

Esse código associa a função button_clicked() com o evento on_click do botão. A cada clique um novo elemento de texto é colocado na página.

Várias outras propriedades podem ser usadas para alterar a aparência dos controles. Vamos usar width (largura) no código abaixo, além do controle Checkbox, uma caixa de texto que pode ser marcada. A função entrar_tarefa() verifica se há conteúdo em nova_tarefa, um TextField e, se houver, cria e insere na página uma nova Checkbox.
Depois limpa o valor de nova_tarefa. O comando nova_tarefa.focus() coloca no comando de texto o foco da ação dentro da página, independente de ela ter ou não sido usada no if.

import flet as ft

def main(page):
    def entrar_tarefa(e):
        if nova_tarefa.value:
            page.add(ft.Checkbox(label=nova_tarefa.value))
            nova_tarefa.value = ""            
        nova_tarefa.focus()

    nova_tarefa = ft.TextField(hint_text="Digite sua nova tarefa...", width=400)
    page.add(ft.Row([nova_tarefa, ft.ElevatedButton("Inserir tarefa", on_click=entrar_tarefa, width=300)]))
    nova_tarefa.focus()

ft.app(target=main)

É claro que muitas outras ações podem ser inseridas nesse pequeno programa, tal como testar se uma entrada já existe, eliminar espaços em branco desnecessários ou gravar as tarefas em um banco de dados.

Outro Exemplo: Controles e propriedades

É comum os tutoriais do Flet apresentarem um pequeno bloco ilustrativo de código com a operação de somar e subtrair uma unidade a um número em uma caixa de texto. Mostramos aqui um código um pouco mais elaborado para apresentar propriedades adicionais. Usamos page.title = "Soma e subtrai" para inserir um título na barra de tarefas (ou na aba do navegador, se o codigo for executado no modo web), as propriedades de alignment. Além disso declaramos os botões e caixas de texto separadamente e depois os inserimos nas linhas.

import flet as ft

def main(page: ft.Page):
    def operar(e):
        numero = int(txt_number.value) + int(e.control.text)
        txt_number.value = str(numero)
        txt_operacao.value = "soma"
        page.update()

    def mult(e):
        numero =int(txt_number.value) * int(e.control.text.replace("*",""))
        txt_number.value = str(numero)
        txt_operacao.value = "multiplica"
        page.update()

    page.title = "Soma, subtrai, multiplica"
    txt_number = ft.TextField(value="0", text_align=ft.TextAlign.RIGHT, width=100)
    txt_info = ft.Text("Você pode somar ou subtrair 1 ou 10, multiplicar por 2, 3, 5, 7")
    txt_operacao = ft.TextField(value="", text_align=ft.TextAlign.RIGHT, width=100)
    
    bt1 = ft.ElevatedButton("-10", on_click=operar, width=100)
    bt2 = ft.ElevatedButton("-1", on_click=operar, width=100)
    bt3 = ft.ElevatedButton("+1", on_click=operar, width=100)
    bt4 = ft.ElevatedButton("+10", on_click=operar, width=100)
    

    bt5 = ft.ElevatedButton("*2", on_click=mult, width=100)
    bt6 = ft.ElevatedButton("*3", on_click=mult, width=100)
    bt7 = ft.ElevatedButton("*5", on_click=mult, width=100)
    bt8 = ft.ElevatedButton("*7", on_click=mult, width=100)

    page.add(ft.Row([txt_info], alignment=ft.MainAxisAlignment.CENTER))
    page.add(ft.Row([bt1, bt2, txt_number, bt3, bt4], alignment=ft.MainAxisAlignment.CENTER))
    page.add(ft.Row([bt5, bt6, txt_operacao, bt7, bt8], alignment=ft.MainAxisAlignment.CENTER))

ft.app(main)

O resultado do código é mostrado na figura 3.

Observe que, ao se clicar nos botões de soma, por ex., o evento on_click chama a função operar(e) passando para ela o parâmetro e, que é um objeto de evento. Este objeto tem propriedades que usamos nas funções de chamada. Na soma (e subtração) capturamos e.control.text, a propriedade de texto exibida nesse botão (-1, +1, etc.). e a usamos para fazer a operação requerida. Os controles possuem diversas propriedades e respondem a eventos específicos, que devemos manipular para contruir a aparência e funcionalidade da interface gráfica.

Vale ainda mencionar que construímos as linhas com a sintaxe ft.Row([bt1, bt2, txt_number, bt3, bt4]), usando uma lista de controles previamente definidos. Essa lista está na primeira posição, onde se insere o valor do parâmetro nomeado controls. Se esse parâmetro não estiver na primeira entrada seu nome deve ser fornecido, como em: page.add(ft.Row(alignment=ft.MainAxisAlignment.CENTER, controls=[txt_info])).

Em uma questão meramente de estilo mas que pode facilitar a organização e leitura do código, podemos definir as linhas separadamente e depois inserí-las na página.

    linha1 = ft.Row([txt_info], alignment=ft.MainAxisAlignment.CENTER)
    linha2 = ft.Row(controls=[bt1, bt2, txt_number, bt3, bt4], alignment=ft.MainAxisAlignment.CENTER)
    linha3 = ft.Row(controls=[bt5, bt6, txt_operacao, bt7, bt8],
             alignment=ft.MainAxisAlignment.CENTER)

    page.add(linha1, linha2, linha3)

Bibiografia

Flet: Flet Documentation
Flet: Flet Tutorial
Pypi.org: Flet 0.8.1
Youtube: Dev JurisFlet: Aprendendo os conceitos básicos para criação de apps Flutter com Python
Hackernoon: Building Flutter Apps with Python
Medium: Build a Markdown Editor Flutter App With the Flet Python Framework
Medium: Flutter Apps in Python-Flet
DEV: Build Flutter Apps using Python Flet

Todas as URLs acessadas em Julho de 2023.

Python com Flet: Widgets

Entidades Html

Posted on 18/10/202215/09/2023 by ph19483170402_ov90l2ad

Entidades HTML são códigos usados para a exibição de símbolos que não estão diretamente acessíveis pelo teclado, dentro de uma página de HTML (páginas da WEB). Eles podem representar caracteres técnicos, matemáticos, símbolos de moedas, sinais gráficos e muitos outros. A tabela lista os códigos html hexadecimal e decimal. Por exemplo, a página:

<html>
<body>
<h1>Exibindo html </h1>
<p>Símbolo de um naipe espada de baralho: &clubs; - &clubsuit; - &♣; - &#9827;.</p>
<p>Símbolo matemático da integral de contorno: &conint; - &oint; - &#x0222e; - &#8750;.
</body>
</html>

seria exibida da seguinte forma (dependendo, é claro, do browser e das instruções css da página):

Exibindo html

Símbolo de um naipe espada de baralho: ♣ – ♣ – ♣ – ♣.
Símbolo matemático, integral de contorno: ∮ – ∮ – ∮ – ∮.

Nem todos os browsers podem exibir corretamente todos os símbolos. Um código na primeira coluna da tabela representa uma falha de exibição. Passe o mouse sobre os caracteres da 1ª coluna para ampliar.

Caracteres comuns: Pontuação

Caracter	HTML	HEX	DEC	Descrição
“	"	"	"	aspas
,	,	,	,	vírgula
.	&period;	.	.	ponto final
:	&colon;	:	:	dois pontos
;	&semi;	;	;	ponto e vírgula
?	&quest;	?	?	ponto de interrogação
¿	¿	¿	¿	ponto de interrogação invertido
!	&excl;	!	!	ponto de exclamação
¡	¡	¡	¡	ponto de exclamação invertido

Barras e Aspas

Caracter	HTML	HEX	DEC	Descrição
‐	&hyphen; &dash;	‐	‐	hífen
–	–	–	–	en dash
—	—	—	—	travessão, metade de emdash
―	&horbar;	―	―	barra horizontal
\|	\| \|	‖	‖	barra vertical
/	/	/	/	barra, travessa ou tranca
\	\	\	\	barra reversa
_	&lowbar;	_	_	linha baixa
¦	¦	¦	¦	barra quebrada
‘	‘ &opencurlyquote;	‘	‘	aspas simples esquerda
’	’ &rsquor; &closecurlyquote;	’	’	aspas simples direitas
‚	&lsquor; &sbquo;	‚	‚	aspas baixas simples
“	“ &opencurlydoublequote;	“	“	aspas duplas esquerdas
”	” &rdquor; &closecurlydoublequote;	”	”	aspas duplas direitas
„	&ldquor; &bdquo;	„	„	aspas baixas duplas
«	«	«	«	aspa dupla angular esquerda
»	»	»	»	aspa dupla angular direita

🔼

Sinais Tipográficos

Caracter	HTML	HEX	DEC	Descrição
§	§	§	§	seção (parágrafo)
¶	¶	¶	¶	marca de parágrafo, alínea
␣	&blank;	␣	␣	caixa aberta

🔼

Abreviaturas

Caracter	HTML	HEX	DEC	Descrição
#	&num;	#	#	número
$	&dollar;	$	$	cifrão
%	&percnt;	%	%	porcentagem
@	&commat;	@	@	comercial em (arroba)
®	®	®	®	marca registrada
°	°	°	°	grau
¢	¢	¢	¢	1 centésimo
¤	¤	¤	¤	moeda
€	€	€	€	sinal do euro
£	£	£	£	libra
¥	¥	¥	¥	iene
&	&	&	&	e comercial
*	&ast; &midast;	*	*	asterisco
¬	¬	¬	¬	negação (not)
				hífen suave
¯	¯ &strns;	¯	¯	mácron
·	·	·	·	ponto central

🔼

Espaçamento e controles

Caracter	HTML	HEX	DEC	Descrição
tab	&tab;			caracter de tabulação
newline	&newline;			alimentação de linha (lf)
	&nonbreakingspace;			espaço sem quebra \| \|
	&ensp;			espaço \| \|
	&emsp;			espaço \| \|
	&emsp13;			espaço 1 terço \| \|
	&emsp14;			espaço 1 quarto \| \|
	&numsp;			espaço de figura \| \|
	&puncsp;			espaço de pontuação \| \|
	&thinspace;			espaço pequeno \| \|
	&hairsp; &verythinspace;			espaço muito pequeno \| \|
	&zerowidthspace; &negativethickspace;			espaço de largura zero \|\|
	&zwnj;	‌	‌	largura zero não grudado \|‌\|
	&zwj;	‍	‍	largura zero grudado \|‍\|
	&mediumspace;			espaço matemático médio \| \|
	&nobreak;	⁠	⁠	juntador de palavras
	&invisibletimes; ⁢	⁢	⁢	multiplicação invisível
	&invisiblecomma; ⁣	⁣	⁣	vírgula invisível
‎	&lrm;	‎	‎	marca da esquerda para a direita
‏	&rlm;	‏	‏	marca da direita para a esquerda

🔼

Ícones, Símbolos

Caracter	HTML	HEX	DEC	Descrição
★	&starf; &bigstar;	★	★	estrela preta
☆	&star;	☆	☆	estrela branca
♠	&spades; &spadesuit;	♠	♠	naipe paus preto
♣	&clubs; &clubsuit;	♣	♣	naipe espada preto
♥	&hearts; &heartsuit;	♥	♥	naipe copa preto
♦	&diams; &diamondsuit;	♦	♦	naipe ouro preto
◊	&loz;	◊	◊	losango branco
♪	&sung;	♪	♪	oitava nota
♭	&flat;	♭	♭	bemol musical
♮	&natur; &natural;	♮	♮	natural de música
♯	&sharp;	♯	♯	sharp, sustenido músical
✓	&check; &checkmark;	✓	✓	marca de verificação
✗	&cross;	✗	✗	seleção x
✠	&malt; &maltese;	✠	✠	cruz maltesa
✶	&sext;	✶	✶	estrela preta de seis pontas
⧫	&lozf; &blacklozenge;	⧫	⧫	losango preto
©	©	©	©	direitos autorais
Ⓢ	&os; &circleds;	Ⓢ	Ⓢ	S maiúsculo circulado
☎	&phone;	☎	☎	telefone preto
♀	&female;	♀	♀	signo feminino
♂	&male;	♂	♂	signo masculino
⏧	&elinters;	⏧	⏧	intersecção elétrica

🔼

Símbolos Matemáticos: Operadores

Caracter	HTML	HEX	DEC	Descrição
+	+	+	+	soma, mais
±	± &pm;	±	±	mais ou menos
×	×	×	×	multiplicação
÷	÷ &div;	÷	÷	divisão
=	=	=	=	igual
<	<	<	<	menor que
>	>	>	>	maior que
−	−	−	−	menos (subtração)
∓	&mnplus; &mp; &minusplus;	∓	∓	menos ou mais
∔	&plusdo; &dotplus;	∔	∔	ponto mais
√	√ &sqrt;	√	√	raiz quadrada
∖	&setmn; &setminus; &ssetmn;	∖	∖	menos de conjunto
∗	&lowast;	∗	∗	operador asterisco
∘	&compfn; &smallcircle;	∘	∘	operador anel
⊕	&oplus; &circleplus;	⊕	⊕	mais circulado
⊖	&ominus; &circleminus;	⊖	⊖	menos circulado
⊗	&otimes; &circletimes;	⊗	⊗	vezes circulado
⊘	&osol;	⊘	⊘	divisão circulada
⊙	&odot; &circledot;	⊙	⊙	ponto circulado
⊚	&ocir; &circledcirc;	⊚	⊚	operador de anel circular
⊛	&oast; &circledast;	⊛	⊛	asterisco circulado
⊝	&odash; &circleddash;	⊝	⊝	traço circulado
⊞	&plusb; &boxplus;	⊞	⊞	mais quadrado
⊟	&minusb; &boxminus;	⊟	⊟	menos quadrado
⊠	&timesb; &boxtimes;	⊠	⊠	vezes quadrado
⊡	&sdotb; &dotsquare;	⊡	⊡	ponto quadrado
⨀	&xodot; &bigodot;	⨀	⨀	operador ponto circulado
⨁	&xoplus; &bigoplus;	⨁	⨁	mais círculo
⨂	&xotime; &bigotimes;	⨂	⨂	vezes circulado
⨄	&xuplus; &biguplus;	⨄	⨄	operador de união com mais
⨆	&xsqcup; &bigsqcup;	⨆	⨆	operador de união quadrado
∀	∀	∀	∀	para todos
∁	&comp; &complement;	∁	∁	complemento
∂	∂ &partiald;	∂	∂	diferencial parcial
∃	∃ &exists;	∃	∃	existe
∄	&nexist; &nexists;	∄	∄	não existe
∅	∅ &emptyset; &emptyv;	∅	∅	conjunto vazio
∇	∇ &del;	∇	∇	nabla
∈	∈ &isinv; &element; &in;	∈	∈	elemento de
∉	∉ &notelement; &notinva;	∉	∉	não é elemento de
∋	&niv; &reverseelement; &ni; &suchthat;	∋	∋	contém como membro
∌	&notni; &notniva; &notreverseelement;	∌	∌	não contém como membro
∏	∏ &product;	∏	∏	produtório
∐	&coprod; &coproduct;	∐	∐	coprodutório
∑	∑	∑	∑	somatório

🔼

Operações e Relações em Conjuntos

Caracter	HTML	HEX	DEC	Descrição
⊎	&uplus; &unionplus;	⊎	⊎	união de conjuntos
⋂	&xcap; &intersection; &bigcap;	⋂	⋂	interseção de conjuntos
⋃	&xcup; &union; &bigcup;	⋃	⋃	união de conjuntos
⊂	⊂ &subset;	⊂	⊂	subconjunto de
⊃	⊃ &supset; &superset;	⊃	⊃	superconjunto de
⊄	&nsub;	⊄	⊄	não é um subconjunto de
⊅	&nsup;	⊅	⊅	não um superconjunto de
⊆	&sube; &subsetequal; &subseteq;	⊆	⊆	subconjunto de ou igual a
⊇	&supe; &supseteq; &supersetequal;	⊇	⊇	superconjunto de ou igual a
⊈	&nsube; &nsubseteq; &notsubsetequal;	⊈	⊈	nem um subconjunto de nem igual a
⊉	&nsupe; &nsupseteq; &notsupersetequal;	⊉	⊉	nem um superconjunto de nem igual a
⊊	&subne; &subsetneq;	⊊	⊊	subconjunto de com não igual a
⊋	&supne; &supsetneq;	⊋	⊋	superconjunto de com não igual a
⊍	&cupdot;	⊍	⊍	multiplicação de conjuntos

🔼

Caracteres Especiais

Caracter	HTML	HEX	DEC	Descrição
ı	&imath; &inodot;	ı	ı	i sem ponto (mat.)
ȷ	&jmath;	ȷ	ȷ	j sem ponto (mat)
ƒ	&fnof;	ƒ	ƒ	f cortado
¹	¹	¹	¹	um sobrescrito
⧜	&iinfin;	⧜	⧜	infinito incompleto
⧝	&infintie;	⧝	⧝	ligadura sobre infinito
⧞	&nvinfin;	⧞	⧞	infinito negado com barra vertical
µ	µ	µ	µ	micro

Frações

Caracter	HTML	HEX	DEC	Descrição
¼	¼	¼	¼	fração um quarto
½	½ &half;	½	½	fração metade
¾	¾	¾	¾	fração três quartos
⅓	&frac13;	⅓	⅓	fração um terço
⅔	&frac23;	⅔	⅔	fração dois terços
⅕	&frac15;	⅕	⅕	fração um quinto
⅖	&frac25;	⅖	⅖	fração dois quintos
⅗	&frac35;	⅗	⅗	fração três quintos
⅘	&frac45;	⅘	⅘	fração quatro quintos
⅙	&frac16;	⅙	⅙	fração um sexto
⅚	&frac56;	⅚	⅚	fração cinco sextos
⅛	&frac18;	⅛	⅛	fração um oitavo
⅜	&frac38;	⅜	⅜	fração três oitavos
⅝	&frac58;	⅝	⅝	fração cinco oitavos
⅞	&frac78;	⅞	⅞	fração sete oitavos

🔼

Sobrescritos

Caracter	HTML	HEX	DEC	Descrição
²	²	²	²	dois sobrescrito
³	³	³	³	três sobrescrito
ª	ª	ª	ª	ordinal feminino
º	º	º	º	ordinal masculino

Delimitadores

Caracter	HTML	HEX	DEC	Descrição
(	(	(	(	parêntese esquerdo
)	)	)	)	parêntese direito
[	[ [	[	[	colchete esquerdo
]	] ]	]	]	colchete direito
{	{ {	{	{	chave esquerda
}	} }	}	}	chave direita
\|	\| \|	\|	\|	linha vertical
〈	&lang; &leftanglebracket; &langle;	⟨	⟨	colchete angular esquerdo
〉	&rang; &rightanglebracket; &rangle;	⟩	⟩	colchete angular direito
⟪	&lang;	⟪	⟪	colchete angular esquerdo duplo
⟫	&rang;	⟫	⟫	colchete angular direito duplo
❘	&verticalseparator;	❘	❘	barra vertical leve

🔼

Delimitadores Decorativos

Caracter	HTML	HEX	DEC	Descrição
❲	&lbbrk;	❲	❲	chave ornamental esquerda
❳	&rbbrk;	❳	❳	chave ornamental direita
⟦	&lobrk; &leftdoublebracket;	⟦	⟦	colchete branco esquerdo
⟧	&robrk; &rightdoublebracket;	⟧	⟧	colchete vazado direito
⟬	&loang;	⟬	⟬	colchete vazado esquerdo
⟭	&roang;	⟭	⟭	colchete vazado direito
⥾	&ufisht;	⥾	⥾	rabo de peixe
⥿	&dfisht;	⥿	⥿	rabo de peixe invertido
⦅	&lopar;	⦅	⦅	parêntese vazado esquerdo
⦆	&ropar;	⦆	⦆	parêntese vazado direito
⦋	&lbrke;	⦋	⦋	colchete esquerdo com barra inferior
⦌	&rbrke;	⦌	⦌	colchete direito com barra inferior
⦍	&lbrkslu;	⦍	⦍	colchete esquerdo com marca no canto superior
⦎	&rbrksld;	⦎	⦎	colchete direito com marca no canto inferior
⦏	&lbrksld;	⦏	⦏	colchete esquerdo com marca no canto inferior
⦐	&rbrkslu;	⦐	⦐	colchete direito com marca no canto superior
⦑	&langd;	⦑	⦑	colchete angular esquerdo com ponto
⦒	&rangd;	⦒	⦒	colchete angular direito com ponto
⦓	&lparlt;	⦓	⦓	arco esquerdo menor que colchete
⦔	&rpargt;	⦔	⦔	arco direito maior que colchete
⦕	&gtlpar;	⦕	⦕	arco esquerdo duplo maior que colchete
⦖	&ltrpar;	⦖	⦖	arco direito duplo menor que colchete

🔼

Integrais

Caracter	HTML	HEX	DEC	Descrição
∫	∫ &integral;	∫	∫	integral
∫	∫	∬	∬	integral dupla
∭	&tint; &iiint;	∭	∭	integral triplo
∮	&conint; &oint; &contourintegral;	∮	∮	integral de contorno
∮	&conint; &doublecontourintegral;	∯	∯	integral de superfície
∱	&cwint;	∱	∱	integral no sentido horário
⨑	&awint;	⨑	⨑	integração anti-horário
∲	&cwconint;	∲	∲	integral de contorno no sentido horário
∳	&awconint;	∳	∳	integral de contorno anti-horário
⨌	&qint; &iiiint;	⨌	⨌	operador quádruplo integral
⨍	&fpartint;	⨍	⨍	parte finita integral
⨐	&cirfnint;	⨐	⨐	função de circulação
⨒	&rppolint;	⨒	⨒	integral de caminho quadrado em torno do pólo
⨓	&scpolint;	⨓	⨓	integral de caminho semicircular em torno do pólo
⨔	&npolint;	⨔	⨔	integral de linha excluindo pólo
⨕	&pointint;	⨕	⨕	integral circular em torno do polo
⨖	&quatint;	⨖	⨖	operador integral de quatérnio
⨗	&intlarhk;	⨗	⨗	integral com seta esquerda com gancho

🔼

Setas

Caracter	HTML	HEX	DEC	Descrição
←	← &leftarrow; &leftarrow; &slarr;	←	←	seta esquerda
↑	↑ &uparrow; &uparrow; &shortuparrow;	↑	↑	seta para cima
→	→ &rightarrow; &rightarrow; &srarr;	→	→	seta direita
↓	↓ &downarrow; &downarrow; &shortdownarrow;	↓	↓	seta para baixo
↔	↔ &leftrightarrow; &leftrightarrow;	↔	↔	seta esquerda-direita
↚	&nlarr;	↚	↚	seta esquerda cortada
↛	&nrarr; &nrightarrow;	↛	↛	seta direita cortada
↝	&rarrw; &rightsquigarrow;	↝	↝	seta ondulada para a direita
←	← &twoheadleftarrow;	↞	↞	seta de duas pontas esquerda
↑	↑	↟	↟	seta de duas pontas para cima
→	→ &twoheadrightarrow;	↠	↠	seta de duas pontas para a direita
↓	↓	↡	↡	seta de duas pontas para baixo
⤵	&cudarrr;	⤵	⤵	seta para a direita e curvando para baixo
↩	&larrhk; &hookleftarrow;	↩	↩	seta esquerda com gancho
↪	&rarrhk; &hookrightarrow;	↪	↪	seta direita com gancho
↕	&varr; &updownarrow; &updownarrow;	↕	↕	seta para cima e para baixo
↖	&nwarr; &nwarrow;	↖	↖	seta noroeste
↗	&nearr; &nearrow;	↗	↗	seta nordeste
↘	&searr; &searrow;	↘	↘	seta sudeste
↙	&swarr; &swarrow;	↙	↙	seta sudoeste
↢	&larrtl; &leftarrowtail;	↢	↢	seta esquerda com cauda
↣	&rarrtl; &rightarrowtail;	↣	↣	seta direita com cauda
↤	&leftteearrow; &mapstoleft;	↤	↤	seta esquerda barra
↥	&upteearrow; &mapstoup;	↥	↥	seta para cima, barra
↦	&map; &rightteearrow; &mapsto;	↦	↦	seta direita, barra
⧴	&ruledelayed;	⧴	⧴	dois pontos, seta direita; rule-delayed
↫	&larrlp; &looparrowleft;	↫	↫	seta esquerda com laço
↬	&rarrlp; &looparrowright;	↬	↬	seta direita com laço
↭	&harrw; &leftrightsquigarrow;	↭	↭	seta onda esquerda direita
↮	&nharr; &nleftrightarrow;	↮	↮	seta traço esquerda direita
↰	&lsh;	↰	↰	seta acima, ponta à esquerda
↱	&rsh;	↱	↱	seta acima, ponta à direita
↲	&ldsh;	↲	↲	seta abaixo, ponta à esquerda
↳	&rdsh;	↳	↳	seta abaixo, ponta à direita
↵	&crarr;	↵	↵	seta para baixo com canto esquerdo
↶	&cularr; &curvearrowleft;	↶	↶	seta semicírculo superior anti-horária
↷	&curarr; &curvearrowright;	↷	↷	seta de semicírculo superior horária
↺	&olarr; &circlearrowleft;	↺	↺	seta circular aberta anti-horária
↻	&orarr; &circlearrowright;	↻	↻	seta circular aberta horária
↼	&lharu; &leftvector; &leftharpoonup;	↼	↼	arpão esquerda, farpa para cima
↽	&lhard; &downleftvector;	↽	↽	arpão esquerda, farpa para baixo
↾	&uharr; &rightupvector;	↾	↾	arpão para cima, farpa para a direita
↿	&uharl; &leftupvector;	↿	↿	arpão para cima, farpa para a esquerda
⇀	&rharu; &rightvector;	⇀	⇀	arpão direita, farpa para cima
⇁	&rhard; &downrightvector;	⇁	⇁	arpão direita, farpa para baixo
⇂	&dharr; &rightdownvector;	⇂	⇂	arpão para baixo, farpa para a direita
⇃	&dharl; &leftdownvector;	⇃	⇃	arpão para baixo, farpa para a esquerda
⇄	&rlarr; &rightleftarrows;	⇄	⇄	seta direita sobre seta esquerda
⇅	&udarr; &uparrowdownarrow;	⇅	⇅	seta para cima para a esquerda da seta para baixo
⇆	&lrarr; &leftrightarrows;	⇆	⇆	seta esquerda sobre seta direita
⇇	&llarr; &leftleftarrows;	⇇	⇇	duas setas, esquerda
⇈	&uuarr; &upuparrows;	⇈	⇈	duas setas para cima
⇉	&rrarr; &rightrightarrows;	⇉	⇉	duas setas para a direita
⇊	&ddarr; &downdownarrows;	⇊	⇊	duas setas para baixo
⇋	&lrhar; &reverseequilibrium; &leftrightharpoons;	⇋	⇋	arpão esquerda sobre o arpão direita
⇌	&rlhar; &rightleftharpoons; &equilibrium;	⇌	⇌	arpão da direita sobre arpão da esquerda
↚	&nlarr; &nleftarrow;	⇍	⇍	seta dupla para a esquerda cortada
↮	&nharr; &nleftrightarrow;	⇎	⇎	seta dupla esquerda direita cortada
↛	&nrarr; &nrightarrow;	⇏	⇏	seta dupla para a direita com traço
←	← &leftarrow; &doubleleftarrow;	⇐	⇐	seta dupla para a esquerda
↑	↑ &uparrow; &doubleuparrow;	⇑	⇑	seta dupla para cima
→	→ &rightarrow; &implies; &doublerightarrow;	⇒	⇒	seta dupla para a direita
↓	↓ &downarrow; &doubledownarrow;	⇓	⇓	seta dupla para baixo
↔	↔ &leftrightarrow; &doubleleftrightarrow; &iff;	⇔	⇔	seta dupla esquerda direita
⇚	&laarr; &lleftarrow;	⇚	⇚	seta tripla para a esquerda
⇛	&raarr; &rrightarrow;	⇛	⇛	seta tripla para a direita
⇝	&zigrarr;	⇝	⇝	seta zigzag para a direita
⇤	&larrb; &leftarrowbar;	⇤	⇤	seta esquerda para barra
⇥	&rarrb; &rightarrowbar;	⇥	⇥	seta direita para barra
⇵	&duarr; &downarrowuparrow;	⇵	⇵	seta para baixo para a esquerda da seta para cima
⇽	&loarr;	⇽	⇽	seta de cabeça aberta para a esquerda
⇾	&roarr;	⇾	⇾	seta de cabeça aberta para a direita
⇿	&hoarr;	⇿	⇿	seta esquerda direita aberta
⟵	&xlarr; &longleftarrow; &longleftarrow;	⟵	⟵	seta longa para a esquerda
⟸	&xlarr; &longleftarrow; &doublelongleftarrow;	⟸	⟸	seta dupla longa para a esquerda
⟶	&xrarr; &longrightarrow; &longrightarrow;	⟶	⟶	seta longa para a direita
⟷	&xharr; &longleftrightarrow; &longleftrightarrow;	⟷	⟷	seta longa esquerda direita
⟶	&xrarr; &longrightarrow; &doublelongrightarrow;	⟹	⟹	seta dupla longa para a direita
⟷	&xharr; &longleftrightarrow;	⟺	⟺	seta dupla longa esquerda direita
⟼	&xmap; &longmapsto;	⟼	⟼	seta longa para a direita da barra
⟿	&dzigrarr;	⟿	⟿	seta longa para a direita
⤂	&nvlarr;	⤂	⤂	seta dupla para a esquerda com traço vertical
⤃	&nvrarr;	⤃	⤃	seta dupla para a direita com traço vertical
⤄	&nvharr;	⤄	⤄	seta dupla esquerda direita com traço vertical
↦	&map;	⤅	⤅	seta de duas pontas para a direita da barra
⤌	&lbarr;	⤌	⤌	seta esquerda com traço duplo
⤍	&rbarr; &bkarow;	⤍	⤍	seta direita com traço duplo
⤌	&lbarr;	⤎	⤎	seta de traço triplo para a esquerda
⤍	&rbarr; &dbkarow;	⤏	⤏	seta de traço triplo para a direita
⤍	&rbarr; &drbkarow;	⤐	⤐	seta de duas pontas para a direita com traço triplo
⤑	&ddotrahd;	⤑	⤑	seta direita com haste pontilhada
⤒	&uparrowbar;	⤒	⤒	seta para cima para barra
⤓	&downarrowbar;	⤓	⤓	seta para baixo para barra
↣	&rarrtl;	⤖	⤖	seta de duas pontas para a direita com cauda
⤙	&latail;	⤙	⤙	cauda de seta esquerda
⤚	&ratail;	⤚	⤚	cauda de seta direita
⤙	&latail;	⤛	⤛	cauda de seta dupla para a esquerda
⤚	&ratail;	⤜	⤜	cauda de seta dupla para a direita
⤝	&larrfs;	⤝	⤝	seta esquerda para diamante preto
⤞	&rarrfs;	⤞	⤞	seta direita para diamante preto
⤟	&larrbfs;	⤟	⤟	seta esquerda da barra ao diamante preto
⤠	&rarrbfs;	⤠	⤠	seta direita da barra para o diamante preto
⤣	&nwarhk;	⤣	⤣	seta noroeste com gancho
⤤	&nearhk;	⤤	⤤	flecha nordeste com gancho
⤥	&searhk; &hksearow;	⤥	⤥	seta sudeste com gancho
⤦	&swarhk; &hkswarow;	⤦	⤦	seta sudoeste com gancho
⤧	&nwnear;	⤧	⤧	seta noroeste e seta nordeste
⤨	&nesear; &toea;	⤨	⤨	seta nordeste e seta sudeste
⤩	&seswar; &tosa;	⤩	⤩	seta sudeste e seta sudoeste
⤪	&swnwar;	⤪	⤪	seta sudoeste e seta noroeste
⤳	&rarrc;	⤳	⤳	seta ondulada para a direita
⤶	&ldca;	⤶	⤶	seta para baixo e curvando para a esquerda
⤷	&rdca;	⤷	⤷	seta para baixo e curvando para a direita
⤸	&cudarrl;	⤸	⤸	arco do lado direito seta no sentido horário
⤹	&larrpl;	⤹	⤹	arco do lado esquerdo no sentido anti-horário
⤼	&curarrm;	⤼	⤼	arco superior seta no sentido horário com menos
⤽	&cularrp;	⤽	⤽	seta do arco superior no sentido anti-horário com mais
⥅	&rarrpl;	⥅	⥅	seta direita com mais abaixo
⥈	&harrcir;	⥈	⥈	seta esquerda direita através de círculo
⥉	&uarrocir;	⥉	⥉	seta de duas pontas para cima do círculo
⥊	&lurdshar;	⥊	⥊	farpa esquerda para cima direita farpa para baixo arpão
⥋	&ldrushar;	⥋	⥋	farpa esquerda para baixo direita farpa para cima arpão
⥎	&leftrightvector;	⥎	⥎	farpa esquerda para cima direita farpa para arpão
⥏	&rightupdownvector;	⥏	⥏	para cima farpa direita para baixo farpa arpão direito
⥐	&downleftrightvector;	⥐	⥐	farpa esquerda para baixo direita farpa para baixo arpão
⥑	&leftupdownvector;	⥑	⥑	cima farpa esquerda baixo farpa esquerda arpão
⥒	&leftvectorbar;	⥒	⥒	arpão esquerda com farpa até a barra
⥓	&rightvectorbar;	⥓	⥓	arpão direita com farpa até a barra
⥔	&rightupvectorbar;	⥔	⥔	arpão para cima com farpa direita na barra
⥕	&rightdownvectorbar;	⥕	⥕	arpão para baixo com farpa à direita da barra
⥖	&downleftvectorbar;	⥖	⥖	arpão esquerda com farpa até a barra
⥗	&downrightvectorbar;	⥗	⥗	arpão direita com farpa até a barra
⥘	&leftupvectorbar;	⥘	⥘	arpão para cima com farpa da esquerda para a barra
⥙	&leftdownvectorbar;	⥙	⥙	arpão para baixo com farpa da esquerda para a barra
⥚	&leftteevector;	⥚	⥚	arpão esquerda com farpa para cima da barra
⥛	&rightteevector;	⥛	⥛	arpão direita com farpa para cima da barra
⥜	&rightupteevector;	⥜	⥜	arpão para cima com farpa direto da barra
⥝	&rightdownteevector;	⥝	⥝	arpão para baixo com farpa direto da barra
⥞	&downleftteevector;	⥞	⥞	arpão esquerda com farpa para baixo da barra
⥟	&downrightteevector;	⥟	⥟	arpão direita com farpa para baixo da barra
⥠	&leftupteevector;	⥠	⥠	arpão para cima com farpa esquerda da barra
⥡	&leftdownteevector;	⥡	⥡	arpão para baixo com farpa esquerda da barra
⥢	&lhar;	⥢	⥢	arpão esquerda com farpa para cima acima do arpão esquerda com farpa para baixo
⥣	&uhar;	⥣	⥣	arpão para cima com farpa esquerda ao lado arpão para cima com farpa direita
⥤	&rhar;	⥤	⥤	arpão direita com farpa para cima acima para arpão direita com farpa para baixo
⥥	&dhar;	⥥	⥥	arpão para baixo com farpa esquerda ao lado arpão para baixo com farpa direita
⥦	&luruhar;	⥦	⥦	arpão esquerda com farpa para cima acima do arpão direita com farpa para cima
⥧	&ldrdhar;	⥧	⥧	arpão esquerda com farpa para baixo acima do arpão direita com farpa para baixo
⥨	&ruluhar;	⥨	⥨	arpão direita com farpa para cima acima do arpão esquerda com farpa para cima
⥩	&rdldhar;	⥩	⥩	arpão direita com farpa para baixo acima do arpão esquerda com farpa para baixo
⥪	&lharul;	⥪	⥪	arpão esquerda com farpa acima do longo traço
⥫	&llhard;	⥫	⥫	arpão esquerda com farpa abaixo do longo traço
⥬	&rharul;	⥬	⥬	arpão direita com farpa acima do longo traço
⥭	&lrhard;	⥭	⥭	arpão direita com farpa abaixo do longo traço
⥮	&udhar; &upequilibrium;	⥮	⥮	arpão p/ cima com farpa esquerda ao lado arpão para baixo com farpa direita
⥯	&duhar; &reverseupequilibrium;	⥯	⥯	arpão para baixo com farpa esquerda ao lado arpão para cima com farpa direita
	&roundimplies;	⥰	⥰	seta dupla direita com cabeça arredondada
⥱	&erarr;	⥱	⥱	igual acima da seta direita
⥲	&simrarr;	⥲	⥲	operador til acima da seta direita
⥳	&larrsim;	⥳	⥳	seta esquerda acima do operador til
⥴	&rarrsim;	⥴	⥴	seta direita acima do operador til
⥵	&rarrap;	⥵	⥵	seta direita acima quase igual a
⥶	&ltlarr;	⥶	⥶	seta esquerda menor que acima
⥸	&gtrarr;	⥸	⥸	maior do que acima da seta direita
⥹	&subrarr;	⥹	⥹	subconjunto acima da seta direita
⥻	&suplarr;	⥻	⥻	superconjunto acima da seta esquerda
⥼	&lfisht;	⥼	⥼	cauda de peixe esquerda
⥽	&rfisht;	⥽	⥽	cauda de peixe direita

Caracteres Gráficos: Desenho

Caracter	HTML	HEX	DEC	Descrição
─	&boxh; &horizontalline;	─	─	parte de caixa: linha horizontal
│	&boxv;	│	│	parte de caixa: linha vertical
┌	&boxdr;	┌	┌	parte de caixa: canto superior esquerdo
┐	&boxdl;	┐	┐	desenho da caixa canto superior direito
└	&boxur;	└	└	parte de caixa: canto inferior esquerdo
┘	&boxul;	┘	┘	parte de caixa: canto inferior direito
├	&boxvr;	├	├	parte de caixa: linha central direita
┤	&boxvl;	┤	┤	parte de caixa: linha central esquerda
┬	&boxhd;	┬	┬	parte de caixa: linha para baixo e horizontal
┴	&boxhu;	┴	┴	parte de caixa: iluminados e horizontais
┼	&boxvh;	┼	┼	parte de caixa: de linha vertical e horizontal
─	&boxh;	═	═	parte de caixa: dupla horizontal
│	&boxv;	║	║	parte de caixa: dupla vertical
┌	&boxdr;	╒	╒	parte de caixa: para baixo simples e duplo direito
┌	&boxdr;	╓	╓	parte de caixa: para baixo duplo e único direito
┌	&boxdr;	╔	╔	os desenhos da caixa dobram para baixo e para a direita
┐	&boxdl;	╕	╕	parte de caixa: para baixo simples e duplo esquerdo
┐	&boxdl;	╖	╖	parte de caixa: para baixo duplo e único esquerdo
┐	&boxdl;	╗	╗	desenhos da caixa dobrar para baixo e para a esquerda
└	&boxur;	╘	╘	parte de caixa: s simples e duplas à direita
└	&boxur;	╙	╙	caixa de desenhos dupla e direita simples
└	&boxur;	╚	╚	os desenhos da caixa dobram e correm
┘	&boxul;	╛	╛	parte de caixa: para cima simples e duplo esquerdo
┘	&boxul;	╜	╜	parte de caixa: duplo e esquerdo simples
┘	&boxul;	╝	╝	os desenhos da caixa dobram e saem
├	&boxvr;	╞	╞	parte de caixa: vertical simples e duplo direito
├	&boxvr;	╟	╟	parte de caixa: vertical duplo e direito simples
├	&boxvr;	╠	╠	parte de caixa: dupla vertical e direita
┤	&boxvl;	╡	╡	parte de caixa: vertical simples e duplo esquerdo
┤	&boxvl;	╢	╢	parte de caixa: dupla vertical e esquerda simples
┤	&boxvl;	╣	╣	parte de caixa: duplo vertical e esquerdo
┬	&boxhd;	╤	╤	parte de caixa: para baixo simples e duplo horizontal
┬	&boxhd;	╥	╥	parte de caixa: para baixo duplo e horizontal simples
┬	&boxhd;	╦	╦	parte de caixa: dobrar para baixo e horizontal
┴	&boxhu;	╧	╧	parte de caixa: para cima simples e duplo horizontal
┴	&boxhu;	╨	╨	parte de caixa: duplo e horizontal simples
┴	&boxhu;	╩	╩	parte de caixa: dobrados e horizontais
┼	&boxvh;	╪	╪	parte de caixa: vertical simples e horizontal duplo
┼	&boxvh;	╫	╫	parte de caixa: dupla vertical e simples horizontal
┼	&boxvh;	╬	╬	parte de caixa: duplo vertical e horizontal
▀	&uhblk;	▀	▀	meio bloco superior
▄	&lhblk;	▄	▄	meio bloco inferior
█	&block;	█	█	bloco completo
░	&blk14;	░	░	sombra clara
▒	&blk12;	▒	▒	tom médio
▓	&blk34;	▓	▓	sombra escura

🔼

Figuras Geométricas

Caracter	HTML	HEX	DEC	Descrição
□	&squ; &square; &square;	□	□	quadrado branco
▪	&squf; &squarf; &blacksquare; &filledverysmallsquare;	▪	▪	quadrado pequeno preto
▫	&emptyverysmallsquare;	▫	▫	quadrado pequeno branco
▭	&rect;	▭	▭	retângulo branco
▮	&marker;	▮	▮	retângulo preto vertical
▱	&fltns;	▱	▱	paralelogramo branco
△	&xutri; &bigtriangleup;	△	△	triângulo branco para cima
▴	&utrif; &blacktriangle;	▴	▴	triângulo pequeno preto para cima
▵	&utri; &triangle;	▵	▵	triângulo pequeno branco para cima
▸	&rtrif; &blacktriangleright;	▸	▸	triângulo pequeno preto para a direita
▹	&rtri; &triangleright;	▹	▹	triângulo pequeno branco para a direita
▽	&xdtri; &bigtriangledown;	▽	▽	triângulo branco para baixo
▾	&dtrif; &blacktriangledown;	▾	▾	triângulo pequeno preto para baixo
▿	&dtri; &triangledown;	▿	▿	ponto baixo branco
◂	&ltrif; &blacktriangleleft;	◂	◂	triângulo pequeno preto para a esquerda
◃	&ltri; &triangleleft;	◃	◃	triângulo pequeno branco para a esquerda
◊	&loz; &lozenge;	◊	◊	pastilha
○	&cir;	○	○	círculo branco
◬	&tridot;	◬	◬	triângulo branco para cima com ponto
◯	&xcirc; &bigcirc;	◯	◯	grande círculo
◸	&ultri;	◸	◸	triângulo superior esquerdo
◹	&urtri;	◹	◹	triângulo superior direito
◺	&lltri;	◺	◺	triângulo inferior esquerdo
◻	&emptysmallsquare;	◻	◻	quadrado médio branco
◼	&filledsmallsquare;	◼	◼	quadrado médio preto

🔼

Acentos

Caracter	HTML	HEX	DEC	Descrição
´	´ &diacriticalacute;	´	´	acento agudo
^	&hat;	^	^	acento circunflexo
ˆ	&circ;	ˆ	ˆ	acento circunflexo
`	&grave; &diacriticalgrave;	`	`	acento grave
˘	&breve;	˘	˘	breve
¸	¸ &cedilla;	¸	¸	cedilha
¨	&dot; &die; ¨	¨	¨	trema
‘	'	'	'	apóstrofe
˜	&tilde;	˜	˜	til pequeno
˙	&dot;	˙	˙	ponto acima
ˇ	&caron;	ˇ	ˇ	caron
˚	&ring;	˚	˚	anel acima
˛	&ogon;	˛	˛	ogonek
˝	&dblac;	˝	˝	acento agudo duplo
_	&UnderBar;	̲	̲	traço subescrito

🔼

Caracteres Acentuados

Caracter	HTML	HEX	DEC	Descrição
À	À	À	À	A grave
Á	Á	Á	Á	A agudo
Â	Â	Â	Â	A circunflexo
Ã	Ã	Ã	Ã	A til
Ä	Ä	Ä	Ä	A trema
Å	Å	Å	Å	A anel
Æ	&Aelig;	Æ	Æ	Ae
à	à	à	à	a grave
á	á	á	á	a agudo
â	â	â	â	a circunflexo
ã	ã	ã	ã	a til
ä	ä	ä	ä	a trema
å	å	å	å	a anel acima
æ	æ	æ	æ	ae
Ā	&Amacr;	Ā	Ā	A mácron
ā	&amacr;	ā	ā	a mácron
Ă	&Abreve;	Ă	Ă	A breve
ă	&abreve;	ă	ă	a breve
Ą	&Aogon;	Ą	Ą	A ogonek
ą	&aogon;	ą	ą	a ogonek
Ć	&Cacute;	Ć	Ć	C com agudo
ć	&cacute;	ć	ć	c com agudo
Ĉ	&Ccirc;	Ĉ	Ĉ	C com circunflexo
ĉ	&ccirc;	ĉ	ĉ	c com circunflexo
Ċ	&Cdot;	Ċ	Ċ	C com ponto acima
ċ	&cdot;	ċ	ċ	c com ponto acima
č	&ccaron;	Č	Č	maiúscula c com caron
č	&ccaron;	č	č	minúscula c com caron
ç	ç	Ç	Ç	c com cedilha
Ď	&Dcaron;	Ď	Ď	D caron
ď	&dcaron;	ď	ď	d caron
Đ	&Dstrok;	Đ	Đ	D com traço
đ	&dstrok;	đ	đ	d com traço
È	È	è	è	E grave
è	è	È	È	e com grave
é	é	É	É	e com agudo
é	é	é	é	e agudo
ê	ê	ê	ê	e circunflexo
ê	ê	Ê	Ê	e com circunflexo
Ë	Ë	Ë	Ë	E com trema
ë	ë	ë	ë	e trema
Ē	&Emacr;	Ē	Ē	E mácron
ē	&emacr;	ē	ē	e mácron
Ė	&Edot;	Ė	Ė	E ponto
ė	&edot;	ė	ė	e ponto
Ę	&Eogon;	Ę	Ę	E com ogonek
ę	&eogon;	ę	ę	e com ogonek
Ě	&Ecaron;	Ě	Ě	E caron
ě	&ecaron;	ě	ě	e caron
ð	ð	ð	ð	eth minúsculo
Ð	&Eth;	Ð	Ð	eth maiúsculo
Ĝ	&Gcirc;	Ĝ	Ĝ	G circunflexo
ĝ	&gcirc;	ĝ	ĝ	g circunflexo
Ğ	&Gbreve;	Ğ	Ğ	G breve
ğ	&gbreve;	ğ	ğ	g breve
Ġ	&Gdot;	Ġ	Ġ	G com ponto acima
ġ	&gdot;	ġ	ġ	g com ponto acima
ǵ	&gacute;	ǵ	ǵ	g com agudo
Ĥ	&Hcirc;	Ĥ	Ĥ	H circunflexo
ĥ	&hcirc;	ĥ	ĥ	h circunflexo
Ħ	&Hstrok;	Ħ	Ħ	H com traço
ħ	&hstrok;	ħ	ħ	h com traço
ì	ì	ì	ì	i grave
í	í	í	í	i agudo
î	î	î	î	i circunflexo
ï	ï	ï	ï	i trema
Ĩ	&itilde;	ĩ	ĩ	I til
ĩ	&itilde;	Ĩ	Ĩ	i til
Ī	&Imacr;	Ī	Ī	I com mácron
ī	&imacr;	ī	ī	i com mácron
Į	&Iogon;	Į	Į	I com ogonek
į	&iogon;	į	į	i com ogonek
İ	&Idot;	İ	İ	I com ponto
Ĳ	&IJlig;	Ĳ	Ĳ	ligadura IJ
ĳ	&ijlig;	ĳ	ĳ	ligadura ij
Ĵ	&Jcirc;	Ĵ	Ĵ	J circunflexo
ĵ	&jcirc;	ĵ	ĵ	j circunflexo
Ķ	&Kcedil;	Ķ	Ķ	K com cedilha
ķ	&kcedil;	ķ	ķ	k com cedilha
ĸ	&kgreen;	ĸ	ĸ	kra minúsculo
Ĺ	&Lacute;	Ĺ	Ĺ	L agudo
ĺ	&lacute;	ĺ	ĺ	l agudo
Ļ	&Lcedil;	Ļ	Ļ	L com cedilha
ļ	&lcedil;	ļ	ļ	l com cedilha
Ľ	&Lcaron;	Ľ	Ľ	L com caron
ľ	&lcaron;	ľ	ľ	l com caron
Ŀ	&Lmidot;	Ŀ	Ŀ	L com ponto
ŀ	&lmidot;	ŀ	ŀ	l com ponto
Ł	&Lstrok;	Ł	Ł	L com traço
ł	&lstrok;	ł	ł	l com traço
Ń	&Nacute;	Ń	Ń	N com agudo
ń	&nacute;	ń	ń	n com agudo
Ņ	&Ncedil;	Ņ	Ņ	N com cedilha
ņ	&ncedil;	ņ	ņ	n com cedilha
Ň	&Ncaron;	Ň	Ň	N com caron
ň	&ncaron;	ň	ň	n com caron
ŉ	&napos;	ŉ	ŉ	n precedida de apóstrofo
ñ	ñ	Ñ	Ñ	n com til
ò	ò	ò	ò	o grave
ó	ó	ó	ó	o agudo
ô	ô	ô	ô	o circunflexo
õ	õ	õ	õ	o til
ö	ö	ö	ö	o com trema
ø	ø	ø	ø	o com traço
Ō	&Omacr;	Ō	Ō	O com macron
ō	&omacr;	ō	ō	o com mácron
Ő	&Odblac;	Ő	Ő	O com duplo agudo
ő	&odblac;	ő	ő	o com duplo agudo
Œ	&Oelig;	Œ	Œ	ligadura OE maiúscula
œ	&oelig;	œ	œ	ligadura oe minúscula
Ŕ	&Racute;	Ŕ	Ŕ	R com agudo
ŕ	&racute;	ŕ	ŕ	r com agudo
Ŗ	&Rcedil;	Ŗ	Ŗ	R com cedilha
ŗ	&rcedil;	ŗ	ŗ	r com cedilha
Ř	&Rcaron;	Ř	Ř	R com caron
ř	&rcaron;	ř	ř	r minúscula com caron
Ś	&Sacute;	Ś	Ś	S com agudo
ś	&sacute;	ś	ś	s com agudo
Ŝ	&Scirc;	Ŝ	Ŝ	S com circunflexo
ŝ	&scirc;	ŝ	ŝ	s com circunflexo
Ş	&Scedil;	Ş	Ş	S com cedilha
ş	&scedil;	ş	ş	s com cedilha
Š	&Scaron;	Š	Š	S com caron
š	&scaron;	š	š	s com caron
Ţ	&Tcedil;	Ţ	Ţ	T com cedilha
ţ	&tcedil;	ţ	ţ	t com cedilha
Ť	&Tcaron;	Ť	Ť	T com caron
ť	&tcaron;	ť	ť	t com caron
Ŧ	&Tstrok;	Ŧ	Ŧ	T com traço
ŧ	&tstrok;	ŧ	ŧ	t com traço
ù	ù	ù	ù	u grave
ú	ú	ú	ú	u agudo
û	û	û	û	u circunflexo
ü	ü	ü	ü	u com trema
Ũ	&Utilde;	Ũ	Ũ	U com til
ũ	&utilde;	ũ	ũ	u com til
Ū	&Umacr;	Ū	Ū	U com mácron
ū	&umacr;	ū	ū	u com mácron
Ŭ	&Ubreve;	Ŭ	Ŭ	U breve
ŭ	&ubreve;	ŭ	ŭ	u breve
Ů	&Uring;	Ů	Ů	U com anel
ů	&uring;	ů	ů	u com anel
Ű	&Udblac;	Ű	Ű	U com duplo agudo
ű	&udblac;	ű	ű	u com duplo agudo
Ų	&Uogon;	Ų	Ų	U com ogonek
ų	&uogon;	ų	ų	u com ogonek
Ŵ	&Wcirc;	Ŵ	Ŵ	W com circunflexo
ŵ	&wcirc;	ŵ	ŵ	w com circunflexo
Ŷ	&Ycirc;	Ŷ	Ŷ	Y com circunflexo
ŷ	&ycirc;	ŷ	ŷ	y com circunflexo
Ÿ	&Yuml;	Ÿ	Ÿ	Y com trema
ÿ	ÿ	ÿ	ÿ	y com trema
Ý	Ý	Ý	Ý	Y com agudo
ý	ý	ý	ý	y com agudo
Ź	&Zacute;	Ź	Ź	Z com agudo
ź	&zacute;	ź	ź	z com agudo
Ż	&Zdot;	Ż	Ż	Z com ponto acima
ż	&zdot;	ż	ż	z com ponto acima
Ž	&Zcaron;	Ž	Ž	Z com caron
ž	&zcaron;	ž	ž	z com caron
Ƶ	&imped;	Ƶ	Ƶ	Z cortado

🔼

Ligaduras de Carateres Latinos

Caracter	HTML	HEX	DEC	Descrição
Ĳ	&IJlig;	Ĳ	Ĳ	ligadura IJ (maiúsculo)
ĳ	&ijlig;	ĳ	ĳ	ligadura ij (minúsculo)
Œ	&OElig;	Œ	amp;Œ;	ligadura OE maiúscula
œ	&oelig;	œ	œ	ligadura oe minúscula
ﬀ	&fflig;	ﬀ	ﬀ	ligadura ff
ﬁ	&filig;	ﬁ	ﬁ	ligadura fi
ﬂ	&fllig;	ﬂ	ﬂ	ligadura fl
ﬃ	&ffilig;	ﬃ	ﬃ	ligadura ffi
ﬄ	&ffllig;	ﬄ	ﬄ	ligadura ffl

Carateres Não Latinos

Caracter	HTML	HEX	DEC	Descrição
ŋ	&eng;	ŋ	ŋ	minúscula eng
Þ	&Thorn;	Þ	Þ	‘thorn’ maiúsculo
þ	þ	þ	þ	‘thorn’ minúsculo
ß	ß	ß	ß	‘eszett’ alemão

🔼

Caracteres script

Caracter	HTML	HEX	DEC	Descrição
𝒶	&ascr;	𝒜	𝒜	a minúsculo
𝒷	&bscr;	𝒝	𝒝	b
𝒸	&cscr;	𝒞	𝒞	c
𝒹	&dscr;	𝒟	𝒟	d
ℯ	&escr;	𝒠	𝒠	e
𝒻	&fscr;	𝒡	𝒡	e
ℊ	&gscr;	𝒢	𝒢	g
𝒽	&hscr;	𝒣	𝒣	h
𝒾	&iscr;	𝒤	𝒤	i
𝒿	&jscr;	𝒥	𝒥	j
𝓀	&kscr;	𝒦	𝒦	k
𝓁	&lscr;	𝒧	𝒧	l
𝓂	&mscr;	𝒨	𝒨	m
𝓃	&nscr;	𝒩	𝒩	n
ℴ	&oscr;	𝒪	𝒪	o
𝓅	&pscr;	𝒫	𝒫	p
𝓆	&qscr;	𝒬	𝒬	q
𝓇	&rscr;	𝒭	𝒭	r
𝓈	&sscr;	𝒮	𝒮	s
𝓉	&tscr;	𝒯	𝒯	t
𝓊	&uscr;	𝒰	𝒰	u
𝓋	&vscr;	𝒱	𝒱	v
𝓌	&wscr;	𝒲	𝒲	w
𝓍	&xscr;	𝒳	𝒳	x
𝓎	&yscr;	𝒴	𝒴	y
𝓏	&zscr;	𝒵	𝒵	z
Caracter	HTML	HEX	DEC	Descrição
𝒜	&Ascr;	𝒶	𝒵	A maiúsculo
ℬ	&Bscr;	𝒷	𝒶	B
𝒞	&Cscr;	𝒸	𝒷	C
𝒟	&Dscr;	𝒹	𝒸	D
ℰ	&Escr;	𝒺	𝒹	E
ℱ	&Fscr;	𝒻	𝒺	F
𝒢	&Gscr;	𝒼	𝒻	G
ℋ	&Hscr;	𝒽	𝒼	H
ℐ	&Iscr;	𝒾	𝒽	I
𝒥	&Jscr;	𝒿	𝒾	J
𝒦	&Kscr;	𝓀	𝒿	K
ℒ	&Lscr;	𝓁	𝓀	L
ℳ	&Mscr;	𝓂	𝓁	M
𝒩	&Nscr;	𝓃	𝓂	N
𝒪	&Oscr;	𝓄	𝓃	O
𝒫	&Pscr;	𝓅	𝓄	P
𝒬	&Qscr;	𝓆	𝓅	Q
ℛ	&Rscr;	𝓇	𝓆	R
𝒮	&Sscr;	𝓈	𝓇	S
𝒯	&Tscr;	𝓉	𝓈	T
𝒰	&Uscr;	𝓊	𝓉	U
𝒱	&Vscr;	𝓋	𝓊	V
𝒲	&Wscr;	𝓌	𝓋	W
𝒳	&Xscr;	𝓍	𝓌	X
𝒴	&Yscr;	𝓎	𝓍	Y
𝒵	&Zscr;	𝓎	𝓎	Z

🔼

Caracteres Fraktur

Caracter	HTML	HEX	DEC	Descrição
𝔞	&afr;	𝔄	𝔄	a minúsculo
𝔟	&bfr;	𝔅	𝔅	b
𝔠	&cfr;	𝔆	𝔆	c
𝔡	&dfr;	𝔇	𝔇	d
𝔢	&efr;	𝔈	𝔈	e
𝔣	&ffr;	𝔉	𝔉	f
𝔤	&gfr;	𝔊	𝔊	g
𝔥	&hfr;	𝔋	𝔋	h
𝔦	&ifr;	𝔌	𝔌	i
𝔧	&jfr;	𝔍	𝔍	j
𝔨	&kfr;	𝔎	𝔎	k
𝔩	&lfr;	𝔏	𝔏	l
𝔪	&mfr;	𝔐	𝔐	m
𝔫	&nfr;	𝔑	𝔑	n
𝔬	&ofr;	𝔒	𝔒	o
𝔭	&pfr;	𝔓	𝔓	p
𝔮	&qfr;	𝔔	𝔔	q
𝔯	&rfr;	𝔕	𝔕	r
𝔰	&sfr;	𝔖	𝔖	s
𝔱	&tfr;	𝔗	𝔗	t
𝔲	&ufr;	𝔘	𝔘	u
𝔳	&vfr;	𝔙	𝔙	v
𝔴	&wfr;	𝔚	𝔚	w
𝔵	&xfr;	𝔛	𝔛	x
𝔶	&yfr;	𝔜	𝔜	y
𝔷	&zfr;	𝔝	𝔝	z
Caracter	HTML	HEX	DEC	Descrição
𝔄	&Afr;	𝔞	𝔞	A maiúsculo
𝔅	&Bfr;	𝔟	𝔟	B
ℭ	&Cfr;	𝔠	𝔠	C
𝔇	&Dfr;	𝔡	𝔡	D
𝔈	&Efr;	𝔢	𝔢	E
𝔉	&Ffr;	𝔣	𝔣	F
𝔊	&Gfr;	𝔤	𝔤	G
ℌ	&Hfr;	𝔥	𝔥	H
ℑ	&Ifr;	𝔦	𝔦	I
𝔍	&Jfr;	𝔧	𝔧	J
𝔎	&Kfr;	𝔨	𝔨	K
𝔏	&Lfr;	𝔩	𝔩	L
𝔐	&Mfr;	𝔪	𝔪	M
𝔑	&Nfr;	𝔫	𝔫	N
𝔒	&Ofr;	𝔬	𝔬	O
𝔓	&Pfr;	𝔭	𝔭	P
𝔔	&Qfr;	𝔮	𝔮	Q
ℜ	&Rfr;	𝔯	𝔯	R
𝔖	&Sfr;	𝔰	𝔰	S
𝔗	&Tfr;	𝔱	𝔱	T
𝔘	&Ufr;	𝔲	𝔲	U
𝔙	&Vfr;	𝔳	𝔳	V
𝔚	&Wfr;	𝔴	𝔴	W
𝔛	&Xfr;	𝔵	𝔵	X
𝔜	&Yfr;	𝔶	𝔶	Y
ℨ	&Zfr;	𝔷	𝔷	Z

🔼

Caracteres de traço duplo

Caracter	HTML	HEX	DEC	Descrição
𝕒	&aopf;	𝔸	𝔸	a minúsculo
𝕓	&bopf;	𝔹	𝔹	b
𝕔	&copf;	𝔹	𝔺	c
𝕕	&dopf;	𝔻	𝔻	d
𝕖	&eopf;	𝔼	𝔼	e
𝕗	&fopf;	𝔽	𝔽	f
𝕘	&gopf;	𝔾	𝔾	g
𝕙	&hopf;	𝔾	𝔿	h
𝕚	&iopf;	𝕀	𝕀	i
𝕛	&jopf;	𝕁	𝕁	j
𝕜	&kopf;	𝕂	𝕂	k
𝕝	&lopf;	𝕃	𝕃	l
𝕞	&mopf;	𝕄	𝕄	m
𝕟	&nopf;	𝕅	𝕅	n
𝕠	&oopf;	𝕆	𝕆	o
𝕡	&popf;	𝕇	𝕇	p
𝕢	&qopf;	𝕈	𝕈	q
𝕣	&ropf;	𝕉	𝕉	r
𝕤	&sopf;	𝕊	𝕊	s
𝕥	&topf;	𝕋	𝕋	t
𝕦	&uopf;	𝕌	𝕌	u
𝕧	&vopf;	𝕍	𝕍	v
𝕨	&wopf;	𝕎	𝕎	w
𝕩	&xopf;	𝕏	𝕏	x
𝕪	&yopf;	𝕐	𝕐	y
𝕫	&zopf;	𝕑	𝕑	z
Caracter	HTML	HEX	DEC	Descrição
𝔸	&Aopf;	𝕒	𝕒	A maiúsculo
𝔹	&Bopf;	𝕓	𝕓	B
ℂ	&Copf;	𝕔	𝕔	C
𝔻	&Dopf;	𝕕	𝕕	D
𝔼	&Eopf;	𝕖	𝕖	E
𝔽	&Fopf;	𝕗	𝕗	F
𝔾	&Gopf;	𝕘	𝕘	G
ℍ	&Hopf;	𝕙	𝕙	H
𝕀	&Iopf;	𝕚	𝕚	I
𝕁	&Jopf;	𝕛	𝕛	J
𝕂	&Kopf;	𝕜	𝕜	K
𝕃	&Lopf;	𝕝	𝕝	L
𝕄	&Mopf;	𝕞	𝕞	M
ℕ	&Nopf;	𝕟	𝕟	N
𝕆	&Oopf;	𝕠	𝕠	O
ℙ	&Popf;	𝕡	𝕡	P
ℚ	&Qopf;	𝕢	𝕢	Q
ℝ	&Ropf;	𝕣	𝕣	R
𝕊	&Sopf;	𝕤	𝕤	S
𝕋	&Topf;	𝕥	𝕥	T
𝕌	&Uopf;	𝕦	𝕦	U
𝕍	&Vopf;	𝕧	𝕧	V
𝕎	&Wopf;	𝕨	𝕨	W
𝕏	&Xopf;	𝕩	𝕩	X
𝕐	&Yopf;	𝕪	𝕪	Y
ℤ	&Zopf;	𝕫	𝕫	Z

🔼

Caracteres Gregos^†

Caracter	HTML	HEX	DEC	Descrição
α	α	Α	Α	alfa maiúsculo grego
β	β	Β	Β	beta maiúsculo grego
γ	γ	Γ	Γ	gama grega maiúscula
δ	δ	Δ	Δ	letra maiúscula grega delta
ε	ε	Ε	Ε	epsilon com letra maiúscula grega
ζ	ζ	Ζ	Ζ	zeta letra maiúscula grega
η	η	Η	Η	letra maiúscula grega eta
θ	θ	Θ	Θ	teta maiúscula grega
ι	ι	Ι	Ι	letra maiúscula iota
κ	κ	Κ	Κ	kappa maiúscula
λ	λ	Λ	Λ	lamda letra maiúscula
μ	μ	Μ	Μ	letra maiúscula mu
ν	ν	Ν	Ν	nu maiúsculo
ξ	ξ	Ξ	Ξ	letra maiúscula xi
ο	ο	Ο	Ο	omicron maiúsculo
π	π	Π	Π	pi maiúscula
ρ	ρ	Ρ	Ρ	rho maiúsculo
σ	σ	Σ	Σ	sigma maiúsculo
τ	τ	Τ	Τ	tau maiúsculo
υ	υ	Υ	Υ	upsilon maiúsculo
φ	φ	Φ	Φ	letra maiúscula phi
χ	χ	Χ	Χ	maiúsculo chi
ψ	ψ	Ψ	Ψ	letra maiúscula psi
ω	ω	Ω	Ω	ômega letra maiúscula
ς	ς ς &sigmaf;	ς	ς	final sigma minúsculo
ϑ	ϑ ϑ &thetasym;	ϑ	ϑ	letra minúscula theta
υ ϒ	&upsi; &upsih;	ϒ	ϒ	Upsilon com símbolo de gancho
φ	&straightphi;	ϕ	ϕ	letra minúscula phi
ϖ	ϖ ϖ	ϖ	ϖ	letra minúscula pi
ϝ	&gammad;	Ϝ	Ϝ	letra digamma
ϰ	ϰ ϰ	ϰ	ϰ	símbolo kappa
ϱ	ϱ ϱ	ϱ	ϱ	letra rho
ε	&epsi; &straightepsilon;	ϵ	ϵ	épsilon semilunar
϶	&bepsi; &backepsilon;	϶	϶	épsilon semilunar invertido

Letras gregas maiúsculas podem ser obtidas com o primeiro caracter em maiúsculo no codigo html. Por exemplo:

Λ = Λ, Σ = Σ, Ω = Ω.

A maioria das letra gregas maiúsculas são parecida com as do alfabeto latino e, por isso, não são muito úteis na simbologia.

🔼

Caracteres Cirílicos

Caracter	HTML	HEX	DEC	Descrição
ё	&iocy;	Ё	Ё	cirílico maiúsculo io
ђ	&djcy;	Ђ	Ђ	dje cirílico maiúsculo
ѓ	&gjcy;	Ѓ	Ѓ	cirílico maiúsculo gje
є	&jukcy;	Є	Є	cirílico maiúsculo ucraniano, isto é
ѕ	&dscy;	Ѕ	Ѕ	cirílico maiúsculo dze
і	&iukcy;	І	І	cirílico maiúsculo bielorrussa-ucraniana i
ї	&yicy;	Ї	Ї	cirílico maiúsculo yi
ј	&jsercy;	Ј	Ј	cirílico maiúsculo je
љ	&ljcy;	Љ	Љ	cirílico maiúsculo lje
њ	&njcy;	Њ	Њ	cirílico maiúsculo nje
ћ	&tshcy;	Ћ	Ћ	cirílico maiúsculo tshe
ќ	&kjcy;	Ќ	Ќ	cirílico maiúsculo kje
ў	&ubrcy;	Ў	Ў	cirílico maiúsculo curta u
џ	&dzcy;	Џ	Џ	cirílico maiúsculo dzhe
а	&acy;	А	А	cirílico maiúsculo a
б	&bcy;	Б	Б	cirílico maiúsculo seja
в	&vcy;	В	В	cirílico maiúsculo ve
г	&gcy;	Г	Г	cirílico maiúsculo ghe
д	&dcy;	Д	Д	cirílico maiúsculo de
е	&iecy;	Е	Е	cirílico maiúsculo , ou seja
ж	&zhcy;	Ж	Ж	cirílico maiúsculo zhe
з	&zcy;	З	З	cirílico maiúsculo ze
и	&icy;	И	И	cirílico maiúsculo i
й	&jcy;	Й	Й	cirílico maiúsculo curto i
к	&kcy;	К	К	cirílico maiúsculo ka
л	&lcy;	Л	Л	cirílico maiúsculo el
м	&mcy;	М	М	cirílico maiúsculo em
н	&ncy;	Н	Н	cirílico maiúsculo en
о	&ocy;	О	О	cirílico maiúsculo o
п	&pcy;	П	П	cirílico maiúsculo pe
р	&rcy;	Р	Р	cirílico maiúsculo
с	&scy;	С	С	letras maiúsculas cirílicas
т	&tcy;	Т	Т	cirílico maiúsculo te
у	&ucy;	У	У	cirílico maiúsculo u
ф	&fcy;	Ф	Ф	cirílico maiúsculo ef
х	&khcy;	Х	Х	cirílico maiúsculo ha
ц	&tscy;	Ц	Ц	cirílico maiúsculo tse
ч	&chcy;	Ч	Ч	cirílico maiúsculo che
ш	&shcy;	Ш	Ш	cirílico maiúsculo sha
щ	&shchcy;	Щ	Щ	cirílico maiúsculo shcha
ъ	&hardcy;	Ъ	Ъ	cirílico maiúsculo
ы	&ycy;	Ы	Ы	cirílico maiúsculo yeru
ь	&softcy;	Ь	Ь	signo suave em cirílico maiúsculo
э	&ecy;	Э	Э	cirílico maiúsculo e
ю	&yucy;	Ю	Ю	cirílico maiúsculo yu
я	&yacy;	Я	Я	cirílico maiúsculo ya
а	&acy;	а	а	cirílico minúsculo a
б	&bcy;	б	б	cirílico minúsculo seja
в	&vcy;	в	в	cirílico minúsculo ve
г	&gcy;	г	г	cirílico minúsculo ghe
д	&dcy;	д	д	cirílico minúsculo de
е	&iecy;	е	е	cirílico minúsculo , isto é
ж	&zhcy;	ж	ж	cirílico minúsculo zhe
з	&zcy;	з	з	letra minúscula ze cirílica
и	&icy;	и	и	cirílico minúsculo i
й	&jcy;	й	й	cirílico minúsculo curta i
к	&kcy;	к	к	letra minúscula ka cirílica
л	&lcy;	л	л	letra minúscula el cirílica
м	&mcy;	м	м	em minúsculo cirílico
н	&ncy;	н	н	cirílico minúsculo en
о	&ocy;	о	о	minúsculo cirílico o
п	&pcy;	п	п	pe minúsculo cirílico
р	&rcy;	р	р	cirílico minúsculo er
с	&scy;	с	с	letras minúsculas cirílicas
т	&tcy;	т	т	cirílico minúsculo te
у	&ucy;	у	у	letra minúscula você em cirílico
ф	&fcy;	ф	ф	cirílico minúsculo ef
х	&khcy;	х	х	cirílico minúsculo ha
ц	&tscy;	ц	ц	cirílico minúsculo tse
ч	&chcy;	ч	ч	cirílico minúsculo che
ш	&shcy;	ш	ш	letra minúscula em cirílico sha
щ	&shchcy;	щ	щ	cirílico minúsculo shcha
ъ	&hardcy;	ъ	ъ	letra minúscula cirílico duro
ы	&ycy;	ы	ы	cirílico minúsculo yeru
ь	&softcy;	ь	ь	signo macio de letra minúscula cirílico
э	&ecy;	э	э	letra minúscula e cirílica
ю	&yucy;	ю	ю	letra minúscula em cirílico, você
я	&yacy;	я	я	cirílico minúsculo sim
ё	&iocy;	ё	ё	cirílico minúsculo io
ђ	&djcy;	ђ	ђ	dje cirílico minúsculo
ѓ	&gjcy;	ѓ	ѓ	cirílico minúsculo gje
є	&jukcy;	є	є	cirílico minúsculo ucraniana, ie
ѕ	&dscy;	ѕ	ѕ	cirílico minúsculo dze
і	&iukcy;	і	і	cirílico minúsculo bielorrussa-ucraniana i
ї	&yicy;	ї	ї	letra minúscula em cirílico yi
ј	&jsercy;	ј	ј	je minúsculo cirílico
љ	&ljcy;	љ	љ	cirílico minúsculo lje
њ	&njcy;	њ	њ	nje minúsculo cirílico
ћ	&tshcy;	ћ	ћ	cirílico minúsculo tshe
ќ	&kjcy;	ќ	ќ	kje minúsculo cirílico
ў	&ubrcy;	ў	ў	cirílico minúsculo curta u
џ	&dzcy;	џ	џ	dzhe minúsculo cirílico

🔼

Miscelânia de Caracteres

Caracter	HTML	HEX	DEC	Descrição
⦚	&vzigzag;	⦚	⦚	linha em ziguezague vertical
⦜	&vangrt;	⦜	⦜	variante de ângulo reto com quadrado
⦝	&angrtvbd;	⦝	⦝	ângulo reto medido com ponto
⦤	&ange;	⦤	⦤	ângulo com barra
⦥	&range;	⦥	⦥	ângulo invertido com barra inferior
⦦	&dwangle;	⦦	⦦	ângulo oblíquo abrindo
⦧	&uwangle;	⦧	⦧	abertura de ângulo oblíquo para baixo
⦨	&angmsdaa;	⦨	⦨	medida de ângulo, seta nordeste
⦩	&angmsdab;	⦩	⦩	medida de ângulo, seta oeste
⦪	&angmsdac;	⦪	⦪	medida de ângulo, seta sudeste
⦫	&angmsdad;	⦫	⦫	medida de ângulo, seta sudoeste
⦬	&angmsdae;	⦬	⦬	medida de ângulo, seta nordeste
⦭	&angmsdaf;	⦭	⦭	medida de ângulo, seta oeste
⦮	&angmsdag;	⦮	⦮	medida de ângulo, seta sudeste
⦯	&angmsdah;	⦯	⦯	medida de ângulo, seta nordeste
⦰	&bemptyv;	⦰	⦰	conjunto vazio invertido
⦱	&demptyv;	⦱	⦱	conjunto vazio com barra superior
⦲	&cemptyv;	⦲	⦲	conjunto vazio com círculo acima
⦳	&raemptyv;	⦳	⦳	conjunto vazio com a seta direita acima
⦴	&laemptyv;	⦴	⦴	conjunto vazio com seta esquerda acima
⦵	&ohbar;	⦵	⦵	círculo com barra horizontal
⦶	&omid;	⦶	⦶	barra vertical circulada
⦷	&opar;	⦷	⦷	circulado paralelo
⦹	&operp;	⦹	⦹	circular perpendicular
⦻	&olcross;	⦻	⦻	círculo com x sobreposto
⦼	&odsold;	⦼	⦼	divisão girado no sentido anti-horário
⦾	&olcir;	⦾	⦾	bala branca circulada
⦿	&ofcir;	⦿	⦿	bala circulada
⧀	&olt;	⧀	⧀	circulou menos que
⧁	&ogt;	⧁	⧁	circulado maior que
⧂	&cirscir;	⧂	⧂	círculo com círculo menor à direita
≗	&cire;	⧃	⧃	círculo com dois traços horizontais para a direita
⧄	&solb;	⧄	⧄	barra diagonal ascendente quadrada
⧅	&bsolb;	⧅	⧅	quadrado caindo barra diagonal
⧉	&boxbox;	⧉	⧉	dois quadrados unidos
⧍	&trisb;	⧍	⧍	triângulo com serifas na parte inferior
⧎	&rtriltri;	⧎	⧎	triângulo direito acima do triângulo esquerdo
⧏	&lefttrianglebar;	⧏	⧏	triângulo esquerdo ao lado da barra vertical
⧐	&righttrianglebar;	⧐	⧐	barra vertical ao lado do triângulo retângulo
∽̱	&race;	⧚	⧚	cerca esquerda dupla ondulada
⧣	&eparsl;	⧣	⧣	é igual a sinal e paralelo inclinado
⧤	&smeparsl;	⧤	⧤	é igual ao sinal e inclinado paralelo ao til acima
⧥	&eqvparsl;	⧥	⧥	idêntico e inclinado paralelo
⧶	&dsol;	⧶	⧶	barra com traço superior
⨢	&pluscir;	⨢	⨢	mais com ponto acima
⨣	&plusacir;	⨣	⨣	mais com circunflexo acima
⨤	&simplus;	⨤	⨤	mais com til acima
⨥	&plusdu;	⨥	⨥	mais com ponto abaixo
⨦	&plussim;	⨦	⨦	mais com til abaixo
⨧	&plustwo;	⨧	⨧	mais com subscrito dois
⨩	&mcomma;	⨩	⨩	menos com vírgula acima
⨪	&minusdu;	⨪	⨪	menos com ponto abaixo
⨭	&loplus;	⨭	⨭	mais no semicírculo esquerdo
⨮	&roplus;	⨮	⨮	mais no semicírculo direito
✗	&cross;	⨯	⨯	vetor ou produto vetorial
⨰	&timesd;	⨰	⨰	multiplicação com ponto acima
⨱	&timesbar;	⨱	⨱	multiplicação com barra inferior
⨳	&smashp;	⨳	⨳	esmagar produto
⨴	&lotimes;	⨴	⨴	multiplicação no semicírculo esquerdo
⨵	&rotimes;	⨵	⨵	multiplicação no semicírculo direito
⨶	&otimesas;	⨶	⨶	multiplicação circulado com acento circunflexo
⊗	&otimes;	⨷	⨷	multiplicação em círculo duplo
⨸	&odiv;	⨸	⨸	divisão circulado
⨹	&triplus;	⨹	⨹	mais no triângulo
⨺	&triminus;	⨺	⨺	menos no triângulo
⨻	&tritime;	⨻	⨻	multiplicação em triângulo
⨼ ⨼	&iprod; &intprod;	⨼	⨼	produto interior
⨿	&amalg;	⨿	⨿	amalgamação ou coproduto
⩀	&capdot;	⩀	⩀	intersecção com ponto
⩂	&ncup;	⩂	⩂	união com barra superior
⩃	&ncap;	⩃	⩃	intersecção com barra superior
⩄	&capand;	⩄	⩄	intersecção com lógica e
⩅	&cupor;	⩅	⩅	união com lógica ou
⩆	&cupcap;	⩆	⩆	união acima da interseção
⩇	&capcup;	⩇	⩇	intersecção acima da união
⩈	&cupbrcap;	⩈	⩈	união acima da barra acima da interseção
⩉	&capbrcup;	⩉	⩉	intersecção acima da barra acima da união
⩊	&cupcup;	⩊	⩊	união ao lado e juntou-se a união
⩋	&capcap;	⩋	⩋	intersecção ao lado e junta com intersecção
⩌	&ccups;	⩌	⩌	união fechada com serifas
⩍	&ccaps;	⩍	⩍	interseção fechada com serifas
⩐	&ccupssm;	⩐	⩐	união fechada com serifas e produto esmagado
∧	&and;	⩓	⩓	duplo lógico e
∨	&or;	⩔	⩔	duplo lógico ou
⩕	&andand;	⩕	⩕	dois lógicos que se cruzam e
⩖	&oror;	⩖	⩖	dois lógicos que se cruzam ou
⩗	&orslope;	⩗	⩗	grande inclinado ou
⩘	&andslope;	⩘	⩘	inclinado grande e
⩚	&andv;	⩚	⩚	lógico e com haste intermediária
⩛	&orv;	⩛	⩛	lógico ou com haste intermediária
⩜	&andd;	⩜	⩜	lógico e com traço horizontal
⩝	&ord;	⩝	⩝	lógico ou com traço horizontal
⩟	&wedbar;	⩟	⩟	lógico e com barra inferior
⩦	&sdote;	⩦	⩦	é igual ao sinal com o ponto abaixo
⩪	&simdot;	⩪	⩪	Operador til com ponto acima
⩭	&congdot;	⩭	⩭	congruente com o ponto acima
⩮	&easter;	⩮	⩮	é igual a asterisco
⩯	&apacir;	⩯	⩯	quase igual a com acento circunflexo
≊	&ape;	⩰	⩰	aproximadamente igual ou igual a
⩱	&eplus;	⩱	⩱	igual acima do mais
⩲	&pluse;	⩲	⩲	mais acima do igual
≂	&esim;	⩳	⩳	igual ao sinal acima do operador til
≔	&colone;	⩴	⩴	dois pontos duplos iguais
⩵	&equal;	⩵	⩵	dois sinais de igual consecutivos
⩷	&eddot; &ddotseq;	⩷	⩷	é igual ao sinal com dois pontos acima e dois pontos abaixo
⩸	&equivdd;	⩸	⩸	equivalente com quatro pontos acima
⩹	&ltcir;	⩹	⩹	menos do que com um círculo dentro
⩺	&gtcir;	⩺	⩺	maior do que com um círculo dentro
⩻	&ltquest;	⩻	⩻	menos do que com ponto de interrogação acima
⩼	&gtquest;	⩼	⩼	maior do que com ponto de interrogação acima
⩽	&les; &lessslantequal; &leqslant;	⩽	⩽	menor ou inclinado igual a
⩾	&ges; &greaterslantequal; &geqslant;	⩾	⩾	maior que ou inclinado igual a
⩿	&lesdot;	⩿	⩿	menor que ou inclinado igual a com ponto dentro
⪀	&gesdot;	⪀	⪀	maior que ou inclinado igual a com ponto dentro
⪁	&lesdoto;	⪁	⪁	menor que ou inclinado igual ao ponto acima
⪂	&gesdoto;	⪂	⪂	maior que ou inclinado igual ao ponto acima
⪃	&lesdotor;	⪃	⪃	menor que ou inclinado igual a com ponto acima à direita
⪄	&gesdotol;	⪄	⪄	maior que ou inclinado igual ao ponto acima à esquerda
⪅	&lap; &lessapprox;	⪅	⪅	menor ou aproximado
⪆	&gap; &gtrapprox;	⪆	⪆	maior que ou aproximado
⪇	&lne; &lneq;	⪇	⪇	menor que e linha única não igual a
⪈	&gne; &gneq;	⪈	⪈	maior que e linha única diferente de
⪉	&lnap; &lnapprox;	⪉	⪉	inferior e não aproximado
⪊	&gnap; &gnapprox;	⪊	⪊	maior que e não aproximado
⋚	&leg; &lesseqqgtr;	⪋	⪋	menor que acima linha dupla igual acima maior que
⋛	&gel; &gtreqqless;	⪌	⪌	maior que acima linha dupla igual acima menor que
⪍	&lsime;	⪍	⪍	menor que acima semelhante ou igual
⪎	&gsime;	⪎	⪎	maior do que acima semelhante ou igual
⪏	&lsimg;	⪏	⪏	menor que acima semelhante acima maior que
⪐	&gsiml;	⪐	⪐	maior que acima semelhante acima menor que
⪑	&lge;	⪑	⪑	menor que acima maior que acima linha dupla igual
⪒	&gle;	⪒	⪒	maior que acima menor que acima linha dupla igual
⪓	&lesges;	⪓	⪓	menor que acima inclinado igual acima maior que acima inclinado igual
⪔	&gesles;	⪔	⪔	maior que acima inclinado igual acima menor que acima inclinado igual
⪕	&els; &eqslantless;	⪕	⪕	inclinado igual ou menor que
⪖	&egs; &eqslantgtr;	⪖	⪖	inclinado igual ou maior que
⪗	&elsdot;	⪗	⪗	inclinado igual ou menor do que com ponto dentro
⪘	&egsdot;	⪘	⪘	inclinado igual ou maior que com ponto dentro
⪙	&el;	⪙	⪙	linha dupla igual ou menor que
⪚	&eg;	⪚	⪚	linha dupla igual ou maior que
⪝	&siml;	⪝	⪝	semelhante ou inferior
⪞	&simg;	⪞	⪞	semelhante ou maior que
⪟	&simle;	⪟	⪟	semelhante acima menos-que acima é igual ao sinal
⪠	&simge;	⪠	⪠	semelhante acima maior do que acima é igual ao sinal
⪡	&lessless;	⪡	⪡	duplo aninhado menor que
⪢	&greatergreater;	⪢	⪢	aninhado duplo maior que
⪤	&glj;	⪤	⪤	maior que sobreposição menor que
⪥	&gla;	⪥	⪥	maior que ao lado menor que
⪦	&ltcc;	⪦	⪦	menos que fechado por curva
⪧	&gtcc;	⪧	⪧	maior que fechado por curva
⪨	&lescc;	⪨	⪨	menos que fechado pela curva acima inclinado igual
⪩	&gescc;	⪩	⪩	maior que fechado por curva acima inclinado igual
⪪	&smt;	⪪	⪪	menor que
⪫	&lat;	⪫	⪫	maior que
⪬	&smte;	⪬	⪬	menor ou igual a
⪭	&late;	⪭	⪭	maior ou igual a
≏	&bumpe;	⪮	⪮	é igual ao sinal com irregular acima
⪯	&pre; &preceq; &precedesequal;	⪯	⪯	precede acima do igual de linha única
⪰	&sce; &succeq; &succeedsequal;	⪰	⪰	sucede acima do igual de linha única
⪯	&pre;	⪳	⪳	precede o igual
⪰	&sce;	⪴	⪴	sucede acima do igual
⪵	&prne; &precneqq;	⪵	⪵	precede acima não é igual a
⪶	&scne; &succneqq;	⪶	⪶	sucede acima não igual a
⪷	&prap; &precapprox;	⪷	⪷	precede acima quase igual a
⪸	&scap; &succapprox;	⪸	⪸	sucede acima de quase igual a
⪹	&prnap; &precnapprox;	⪹	⪹	precede acima, não quase igual a
⪺	&scnap; &succnapprox;	⪺	⪺	sucede acima, não quase igual a
≺	&pr;	⪻	⪻	o dobro precede
≻	&sc;	⪼	⪼	sucesso duplo
⪽	&subdot;	⪽	⪽	subconjunto com ponto
⪾	&supdot;	⪾	⪾	superconjunto com ponto
⪿	&subplus;	⪿	⪿	subconjunto com mais abaixo
⫀	&supplus;	⫀	⫀	superconjunto com mais abaixo
⫁	&submult;	⫁	⫁	subconjunto com multiplicação abaixo
⫂	&supmult;	⫂	⫂	superconjunto com multiplicação abaixo
⫃	&subedot;	⫃	⫃	subconjunto de ou igual a com ponto acima
⫄	&supedot;	⫄	⫄	superconjunto de ou igual a com ponto acima
⊆	&sube; &subseteqq;	⫅	⫅	subconjunto de igual acima
⊇	&supe; &supseteqq;	⫆	⫆	superconjunto de igual acima
⫇	&subsim;	⫇	⫇	subconjunto do operador til acima
⫈	&supsim;	⫈	⫈	superconjunto do operador til acima
⊊	&subne; &subsetneqq;	⫋	⫋	subconjunto de acima não igual a
⊋	&supne; &supsetneqq;	⫌	⫌	superconjunto de acima não igual a
⫏	&csub;	⫏	⫏	subconjunto fechado
⫐	&csup;	⫐	⫐	superconjunto fechado
⫑	&csube;	⫑	⫑	subconjunto fechado ou igual a
⫒	&csupe;	⫒	⫒	superconjunto fechado ou igual a
⫓	&subsup;	⫓	⫓	subconjunto acima do superconjunto
⫔	&supsub;	⫔	⫔	superconjunto acima do subconjunto
⫕	&subsub;	⫕	⫕	subconjunto acima do subconjunto
⫖	&supsup;	⫖	⫖	superconjunto acima do superconjunto
⫗	&suphsub;	⫗	⫗	superconjunto ao lado do subconjunto
⫘	&supdsub;	⫘	⫘	superconjunto ao lado e unido por traço com subconjunto
⫙	&forkv;	⫙	⫙	elemento de abertura para baixo
⫚	&topfork;	⫚	⫚	forcado com camiseta
⫛	&mlcp;	⫛	⫛	intersecção transversal
⊣	&dashv; &doublelefttee;	⫤	⫤	barra vertical dupla catraca esquerda
⫦	&vdashl;	⫦	⫦	traço longo do membro esquerdo da vertical dupla
⫧	&barv;	⫧	⫧	amura curta com barra superior
⫨	&vbar;	⫨	⫨	amura curta com barra inferior
⫩	&vbarv;	⫩	⫩	amura curta acima da amura curta
⫪	&vbar;	⫫	⫫	dobrar a aderência
¬	¬	⫬	⫬	traço duplo não sinal
⌐	&bnot;	⫭	⫭	traço duplo invertido sem sinal
⫮	&rnmid;	⫮	⫮	não divide com barra de negação invertida
⫯	&cirmid;	⫯	⫯	linha vertical com círculo acima
⫰	&midcir;	⫰	⫰	linha vertical com círculo abaixo
⫱	&topcir;	⫱	⫱	rumo para baixo com círculo abaixo
⫲	&nhpar;	⫲	⫲	paralelo com traço horizontal
⫳	&parsim;	⫳	⫳	paralelo com operador til
⫽	&parsl;	⫽	⫽	operador barra dupla

🔼

Sinais Gráficos

Caracter	HTML	HEX	DEC	Descrição
†	&dagger;	†	†	punhal
‡	&dagger; &ddagger;	‡	‡	punhal duplo
•	• &bullet;	•	•	bala
‥	&nldr;	‥	‥	líder de dois pontos
…	… &mldr;	…	…	elipse horizontal
‰	&permil;	‰	‰	por milhar
‱	&pertenk;	‱	‱	por dez mil
′	′	′	′	aspas
′	′	″	″	aspas dupla
‴	‴	‴	‴	aspas tripla
⁗	&qprime;	⁗	⁗	aspas quádruplas
‵	&bprime; &backprime;	‵	‵	aspas invertida
‹	&lsaquo;	‹	‹	única aspa angular esquerda
›	&rsaquo;	›	›	única aspa angular direita
‾	&oline;	‾	‾	overline
⁁	&caret;	⁁	⁁	ponto de inserção acento circunflexo
⁃	&hybull;	⁃	⁃	hífen marcador
⁄	&frasl;	⁄	⁄	barra de fração
⁏	&bsemi;	⁏	⁏	ponto e vírgula invertido
⁡	&applyfunction; ⁡	⁡	⁡	aplicação de função
⃛	&tdot; &tripledot;	⃛	⃛	combinando três pontos acima
	&copf; &complexes;	ℂ	ℂ	c maiúsculo duplo
℅	&incare;	℅	℅	aos cuidados de
ℊ	&gscr;	ℊ	ℊ	script g minúsculo
ℋ	&hamilt; &hilbertspace; &hscr;	ℋ	ℋ	script h maiúsculo
𝔥	&hfr; &poincareplane;	ℌ	ℌ	letra preta h maiúsculo
𝕙	&quaternions; &hopf;	ℍ	ℍ	H maiúsculo duplo
ℎ	&planckh;	ℎ	ℎ	constante de planck
ℏ	&planck; &hbar; &plankv; &hslash;	ℏ	ℏ	Planck cortado
ℐ	&iscr; &imagline;	ℐ	ℐ	script I maiúsculo
ℑ	&image; &im; &imagpart; &ifr;	ℑ	ℑ	letra preta i maiúscula
ℒ	&lscr; &lagran; &laplacetrf;	ℒ	ℒ	script l maiúsculo
ℓ	&ell;	ℓ	ℓ	roteiro pequeno l
ℕ	&nopf; &naturals;	ℕ	ℕ	n maiúsculo duplo
№	&numero;	№	№	sinal numero
℗	&copysr;	℗	℗	gravação de som copyright
℘	&weierp; &wp;	℘	℘	script p
ℙ	&popf; &primes;	ℙ	ℙ	p maiúsculo duplo
ℚ	&rationals; &qopf;	ℚ	ℚ	Q maiúsculo duplo
ℛ	&rscr; &realine;	ℛ	ℛ	script r maiúsculo
ℜ	&real; &re; &realpart; &rfr;	ℜ	ℜ	reais
ℝ	&reals; &ropf;	ℝ	ℝ	r maiúsculo duplo
℞	&rx;	℞	℞	receita
™	™ ™	™	™	marca registrada
ℤ	&integers; &zopf;	ℤ	ℤ	z maiúsculo duplo
Ω	&ohm;	Ω	Ω	ohm (resistência)
℧	&mho;	℧	℧	ohm invertido
ℨ	&zfr; &zeetrf;	ℨ	ℨ	preta z maiúscula
℩	&iiota;	℩	℩	minúsculo iota
Å	&angst;	Å	Å	angstrom
ℬ	&bernou; &bernoullis;	ℬ	ℬ	script b maiúsculo
	&cfr; &cayleys;	ℭ	ℭ	letra preta c maiúscula
ℯ	&escr;	ℯ	ℯ	script e pequeno
ℯ	&escr; &expectation;	ℰ	ℰ	script e maiúsculo
	&fscr; &fouriertrf;	ℱ	ℱ	script f maiúsculo
ℳ	&phmmat; &mellintrf; &mscr;	ℳ	ℳ	script m
ℴ	&order; &orderof; &oscr;	ℴ	ℴ	script pequeno o
ℵ	&alefsym; &aleph;	ℵ	ℵ	símbolo alef
ℶ	&beth;	ℶ	ℶ	símbolo de aposta
ℷ	&gimel;	ℷ	ℷ	símbolo gimel
ℸ	&daleth;	ℸ	ℸ	símbolo dalet
ⅅ	&dD;	ⅅ	ⅅ	itálico duplo traçado d
ⅆ	&dd;	ⅆ	ⅆ	itálico duplo traçado pequeno d
ⅇ	&exponentiale; &exponentiale; &ee;	ⅇ	ⅇ	e pequeno itálico duplo traçado
ⅈ	&imaginaryi; &ii;	ⅈ	ⅈ	itálico duplo traçado pequeno i
∝	&prop; &propto; &vprop;	∝	∝	proporcional a
∞	∞	∞	∞	infinito
∟	&angrt;	∟	∟	ângulo reto
∠	&ang;	∠	∠	ângulo
∡	&angmsd; &measuredangle;	∡	∡	ângulo medido
∢	&angsph;	∢	∢	ângulo esférico
∣	&mid; &smid; &shortmid;	∣	∣	divide
∤	&nmid; &nsmid; &nshortmid;	∤	∤	não divide
∥	&par; &parallel; &spar;	∥	∥	paralelo a
∦	&npar; &nparallel;	∦	∦	não paralelo a
∧	&and; &wedge;	∧	∧	lógico e
∨	&or; &vee;	∨	∨	lógico ou
∩	∩	∩	∩	interseção
∪	∪	∪	∪	união
∴	&there4; &therefore; &therefore;	∴	∴	portanto
∵	&becaus; &because; &because;	∵	∵	porque
∶	&ratio;	∶	∶	razão
:	&colon; &proportion;	∷	∷	proporção
∸	&minusd; &dotminus;	∸	∸	ponto menos
∻	&homtht;	∻	∻	homotético
∼	&sim; &thksim; &thicksim;	∼	∼	operador til
∽	&bsim; &backsim;	∽	∽	til invertido
∾	&ac; &mstpos;	∾	∾	S invertido
∿	&acd;	∿	∿	senoidal
≀	&wreath; &verticaltilde; &wr;	≀	≀	produto de coroa
≁	&nsim; &nottilde;	≁	≁	til cortado
≂	&esim; &equaltilde; &eqsim;	≂	≂	menos til
≃	&sime; &tildeequal; &simeq;	≃	≃	assintoticamente igual a
≄	&nsime; &nsimeq; &nottildeequal;	≄	≄	não assintoticamente igual a
≅	&cong; &tildefullequal;	≅	≅	aproximadamente igual a
≆	&simne;	≆	≆	aproximadamente, mas não exatamente igual
≇	&ncong; &nottildefullequal;	≇	≇	nem aproximado nem igual a
≈	≈ ≈ ≈ &thkap; &thickapprox;	≈	≈	quase igual
≉	&nap; &nottildetilde; &napprox;	≉	≉	não quase igual
≊	&ape; &approxeq;	≊	≊	quase igual ou igual
≋	&apid;	≋	≋	triplo till
≌	&bcong; &backcong;	≌	≌	todos iguais a
≍	&asympeq; &cupcap;	≍	≍	equivalente a
≎	&bump; &humpdownhump; &bumpeq;	≎	≎	geometricamente equivalente a
≏	&bumpe; &humpequal; &bumpeq;	≏	≏	diferença entre
≐	&esdot; &dotequal; &doteq;	≐	≐	aproxima-se do limite
ė	&edot; &doteqdot;	≑	≑	geometricamente igual a
≔	&colone; &coloneq;	≔	≔	dois pontos igual
≕	&ecolon; &eqcolon;	≕	≕	igual dois pontos
≖	&ecir; &eqcirc;	≖	≖	anel igual a
≗	&cire; &circeq;	≗	≗	anel igual a
≙	&wedgeq;	≙	≙	estimativas
≚	&veeeq;	≚	≚	equiangular para
≜	&trie; &triangleq;	≜	≜	delta igual
≟	&equest; &questeq;	≟	≟	igual questionado
≠	≠ &notequal;	≠	≠	não é igual a (diferente)
≡	&equiv; &congruent;	≡	≡	idêntico a
≢	&nequiv; &notcongruent;	≢	≢	não idêntico a
≤	≤ &leq;	≤	≤	menor ou igual
≥	≥ &greaterequal; &geq;	≥	≥	maior ou igual
≤	≤ &lessfullequal; &leqq;	≦	≦	menor que, igual
≥	≥ &greaterfullequal; &geqq;	≧	≧	maior do, igual
⪇	&lne; &lneqq;	≨	≨	menor que, diferente
⪈	&gne; &gneqq;	≩	≩	maior que, diferente
<	< &nestedlessless; &ll;	≪	≪	muito menor que
>	> &nestedgreatergreater; &gg;	≫	≫	muito maior que
≬	&twixt; &between;	≬	≬	entre
≮	&nlt; &notless; &nless;	≮	≮	não menor que
≯	&ngt; &notgreater; &ngtr;	≯	≯	não maior que
≰	&nle; &notlessequal; &nleq;	≰	≰	nem menor que nem igual a
≱	&nge; &notgreaterequal; &ngeq;	≱	≱	nem maior que nem igual a
≲	&lsim; &lesstilde; &lesssim;	≲	≲	menor ou equivalente a
≳	&gsim; &gtrsim; &greatertilde;	≳	≳	maior que ou equivalente a
≴	&nlsim; &notlesstilde;	≴	≴	nem menor que nem equivalente a
≵	&ngsim; &notgreatertilde;	≵	≵	nem maior que nem equivalente a
≶	&lg; &lessgtr; &lessgreater;	≶	≶	menor ou maior que
≷	&gl; &gtrless; &greaterless;	≷	≷	maior ou menor que
≸	&ntlg; &notlessgreater;	≸	≸	nem menor que nem maior que
≹	&ntgl; &notgreaterless;	≹	≹	nem maior que nem menor que
≺	&pr; &precedes; &prec;	≺	≺	precede
≻	&sc; &succeeds; &succ;	≻	≻	sucede
≼	&prcue; &precedesslantequal; &preccurlyeq;	≼	≼	precede ou igual a
≽	&sccue; &succeedsslantequal; &succcurlyeq;	≽	≽	sucede ou igual
≾	&prsim; &precsim; &precedestilde;	≾	≾	precede ou equivalente a
≿	&scsim; &succsim; &succeedstilde;	≿	≿	sucede ou equivalente a
⊀	&npr; &nprec; &notprecedes;	⊀	⊀	não precede
⊁	&nsc; &nsucc; &notsucceeds;	⊁	⊁	não sucede
⊏	&sqsub; &squaresubset; &sqsubset;	⊏	⊏	imagem quadrada de
⊐	&sqsup; &squaresuperset; &sqsupset;	⊐	⊐	quadrado original de
⊑	&sqsube; &squaresubsetequal; &sqsubseteq;	⊑	⊑	imagem quadrada de ou igual a
⊒	&sqsupe; &squaresupersetequal; &sqsupseteq;	⊒	⊒	quadrado original de ou igual a
⊓	&sqcap; &squareintersection;	⊓	⊓	chapeu quadrado
⊔	&sqcup; &squareunion;	⊔	⊔	copo quadrado
⊢	&vdash; &righttee;	⊢	⊢	rumo direito
⊣	&dashv; &lefttee;	⊣	⊣	rumo esquerdo
⊤	&top; &downtee;	⊤	⊤	aderência
⊥	&bottom; &bot; &perp; &uptee;	⊥	⊥	aderência
⊧	&models;	⊧	⊧	modela
⊢	&vdash; &doublerighttee;	⊨	⊨	verdadeiro
⊢	&vdash;	⊩	⊩	forças
⊢	&vdash;	⊫	⊫	barra vertical dupla catraca direita dupla
⊬	&nvdash;	⊬	⊬	não prova
⊬	&nvdash;	⊭	⊭	Não é verdade
⊬	&nvdash;	⊮	⊮	não força
⊬	&nvdash;	⊯	⊯	torniquete duplo direito barra vertical dupla negada
⊰	&prurel;	⊰	⊰	precede em relação
⊲	&vltri; &vartriangleleft; &lefttriangle;	⊲	⊲	subgrupo normal de
⊳	&vrtri; &vartriangleright; &righttriangle;	⊳	⊳	contém como subgrupo normal
⊴	&ltrie; &trianglelefteq; &lefttriangleequal;	⊴	⊴	subgrupo normal ou igual a
⊵	&rtrie; &trianglerighteq; &righttriangleequal;	⊵	⊵	contém como subgrupo normal ou igual a
⊶	&origof;	⊶	⊶	original de
⊷	&imof;	⊷	⊷	imagem de
⊸	&mumap; &multimap;	⊸	⊸	multimapa
⊹	&hercon;	⊹	⊹	matriz conjugada hermitiana
⊺	&intcal; &intercal;	⊺	⊺	intercalar
⊻	&veebar;	⊻	⊻	xor lógico
⊽	&barvee;	⊽	⊽	nor lógico
⊾	&angrtvb;	⊾	⊾	ângulo reto com arco
⊿	&lrtri;	⊿	⊿	triângulo retângulo
⋀	&xwedge; &wedge; &bigwedge;	⋀	⋀	n-ário lógico e
⋁	&xvee; &vee; &bigvee;	⋁	⋁	n-ário lógico ou
⋄	&diam; &diamond; &diamond;	⋄	⋄	operador de diamante
⋅	⋅	⋅	⋅	operador de ponto
⋆	&sstarf; &star;	⋆	⋆	operador estrela
⋇	&divonx; &divideontimes;	⋇	⋇	vezes divisão
⋈	&bowtie;	⋈	⋈	gravata-borboleta
⋉	&ltimes;	⋉	⋉	produto semidireto de fator normal esquerdo
⋊	&rtimes;	⋊	⋊	produto semidireto de fator normal correto
⋋	&lthree; &leftthreetimes;	⋋	⋋	produto semidireto esquerdo
⋌	&rthree; &rightthreetimes;	⋌	⋌	produto semidireto certo
⋍	&bsime; &backsimeq;	⋍	⋍	til invertido é igual a
⋎	&cuvee; &curlyvee;	⋎	⋎	ou lógico curvo
⋏	&cuwed; &curlywedge;	⋏	⋏	e lógico curvo
⊂	⊂ &subset;	⋐	⋐	subconjunto duplo
⊃	⊃ &supset;	⋑	⋑	superconjunto duplo
∩	∩	⋒	⋒	cruzamento duplo
∪	∪	⋓	⋓	união dupla
⋔	&fork; &pitchfork;	⋔	⋔	forquilha
⋕	&epar;	⋕	⋕	igual e paralelo a
⋖	&ltdot; &lessdot;	⋖	⋖	menos do que com ponto
⋗	&gtdot; &gtrdot;	⋗	⋗	maior do que com ponto
≪	&ll;	⋘	⋘	muito menos do que
≫	&gg; &ggg;	⋙	⋙	muito maior do que
⋚	&leg; &lessequalgreater; &lesseqgtr;	⋚	⋚	menor que igual ou maior que
⋛	&gel; &gtreqless; &greaterequalless;	⋛	⋛	maior que igual ou menor que
⋞	&cuepr; &curlyeqprec;	⋞	⋞	igual a ou precede
⋟	&cuesc; &curlyeqsucc;	⋟	⋟	igual ou sucede
⋠	&nprcue; &notprecedesslantequal;	⋠	⋠	não precede ou é igual
⋡	&nsccue; &notsucceedsslantequal;	⋡	⋡	não sucede ou igual
⋢	&nsqsube; &notsquaresubsetequal;	⋢	⋢	imagem não quadrada ou igual a
⋣	&nsqsupe; &notsquaresupersetequal;	⋣	⋣	não quadrado original ou igual a
⋦	&lnsim;	⋦	⋦	menor que, mas não equivalente a
⋧	&gnsim;	⋧	⋧	maior que, mas não equivalente a
⋨	&prnsim; &precnsim;	⋨	⋨	precede, mas não é equivalente a
⋩	&scnsim; &succnsim;	⋩	⋩	sucede, mas não equivalente a
⋪	&nltri; &ntriangleleft; &notlefttriangle;	⋪	⋪	subgrupo não normal de
⋫	&nrtri; &ntriangleright; &notrighttriangle;	⋫	⋫	não contém um subgrupo normal
⋬	&nltrie; &ntrianglelefteq; &notlefttriangleequal;	⋬	⋬	subgrupo não normal ou igual a
⋭	&nrtrie; &ntrianglerighteq; &notrighttriangleequal;	⋭	⋭	não contém subgrupo normal ou igual
⋮	&vellip;	⋮	⋮	elipse vertical
⋯	&ctdot;	⋯	⋯	elipse horizontal da linha média
⋰	&utdot;	⋰	⋰	elipse diagonal direita
⋱	&dtdot;	⋱	⋱	elipse diagonal direita para baixo
⋲	&disin;	⋲	⋲	elemento de com longo curso horizontal
⋳	&isinsv;	⋳	⋳	elemento de com barra vertical no final do curso horizontal
⋴	&isins;	⋴	⋴	pertence com traço vertical
⋵	&isindot;	⋵	⋵	elemento de com ponto acima
⋶	&notinvc;	⋶	⋶	elemento de com barra superior
⋷	&notinvb;	⋷	⋷	pertence com barra superior
⋺	&nisd;	⋺	⋺	contém com longo curso horizontal
⋻	&xnis;	⋻	⋻	contém com barra vertical
⋼	&nis;	⋼	⋼	pertence à esquerda com barra vertical
⋽	&notnivc;	⋽	⋽	contém com barra superior
⋾	&notnivb;	⋾	⋾	pequeno contém com barra superior
⌅	&barwed; &barwedge;	⌅	⌅	projetivo
⌅	&barwed; &doublebarwedge;	⌆	⌆	perspectiva
⌈	&lceil; &leftceiling;	⌈	⌈	teto esquerdo
⌉	&rceil; &rightceiling;	⌉	⌉	teto direito
⌊	&lfloor; &leftfloor;	⌊	⌊	chão esquerdo
⌋	&rfloor; &rightfloor;	⌋	⌋	chão certo
⌌	&drcrop;	⌌	⌌	corte inferior direito
⌍	&dlcrop;	⌍	⌍	corte inferior esquerdo
⌎	&urcrop;	⌎	⌎	corte superior direito
⌏	&ulcrop;	⌏	⌏	corte superior esquerdo
⌐	&bnot;	⌐	⌐	invertido, não assinar
⌒	&profline;	⌒	⌒	arco
⌓	&profsurf;	⌓	⌓	segmento
⌕	&telrec;	⌕	⌕	gravador de telefone
⌖	&target;	⌖	⌖	indicador de posição
⌜	&ulcorn; &ulcorner;	⌜	⌜	canto superior esquerdo
⌝	&urcorn; &urcorner;	⌝	⌝	canto superior direito
⌞	&dlcorn; &llcorner;	⌞	⌞	canto inferior esquerdo
⌟	&drcorn; &lrcorner;	⌟	⌟	canto inferior direito
⌢	&frown; &sfrown;	⌢	⌢	carranca
⌣	&smile; &ssmile;	⌣	⌣	sorriso
⌭	&cylcty;	⌭	⌭	cilindricidade
⌮	&profalar;	⌮	⌮	perfil generalizado
⌶	&topbot;	⌶	⌶	símbolo funcional apl i-beam
⌽	&ovbar;	⌽	⌽	estilo de círculo de símbolo funcional apl
⌿	&solbar;	⌿	⌿	barra de barra de símbolo funcional apl
⍼	&angzarr;	⍼	⍼	ângulo reto com seta em zigue-zague para baixo
⎰	&lmoust; &lmoustache;	⎰	⎰	seção superior esquerda ou inferior direita das chaves
⎱	&rmoust; &rmoustache;	⎱	⎱	seção superior direita ou inferior esquerda das chaves
⎴	&tbrk; &overbracket;	⎴	⎴	colchete superior
⎵	&bbrk; &underbracket;	⎵	⎵	colchete inferior
⎶	&bbrktbrk;	⎶	⎶	colchete inferior sobre colchete superior
⏢	&trpezium;	⏢	⏢	trapézio branco

🔼

Emoticons

Símbolo	HEX	DEC	Símbolo	HEX	DEC	Símbolo	HEX	DEC	Símbolo	HEX	DEC
⌚	#8986	#231A	💠	#128160	#1F4A0	🎈	#127880	#1F388	😩	#128553	#1F629
⌛	#8987	#231B	💡	#128161	#1F4A1	🎉	#127881	#1F389	😪	#128554	#1F62A
⏩	#9193	#23E9	💢	#128162	#1F4A2	🎊	#127882	#1F38A	😫	#128555	#1F62B
⏪	#9194	#23EA	💣	#128163	#1F4A3	🎋	#127883	#1F38B	😬	#128556	#1F62C
⏫	#9195	#23EB	💤	#128164	#1F4A4	🎌	#127884	#1F38C	😭	#128557	#1F62D
⏬	#9196	#23EC	💥	#128165	#1F4A5	🎍	#127885	#1F38D	😮	#128558	#1F62E
⏭	#9197	#23ED	💦	#128166	#1F4A6	🎎	#127886	#1F38E	😯	#128559	#1F62F
⏮	#9198	#23EE	💧	#128167	#1F4A7	🎏	#127887	#1F38F	😰	#128560	#1F630
⏯	#9199	#23EF	💨	#128168	#1F4A8	🎐	#127888	#1F390	😱	#128561	#1F631
⏰	#9200	#23F0	💩	#128169	#1F4A9	🎑	#127889	#1F391	😲	#128562	#1F632
⏱	#9201	#23F1	💪	#128170	#1F4AA	🎒	#127890	#1F392	😳	#128563	#1F633
⏲	#9202	#23F2	💫	#128171	#1F4AB	🎓	#127891	#1F393	😴	#128564	#1F634
⏳	#9203	#23F3	💬	#128172	#1F4AC	🎖	#127894	#1F396	😵	#128565	#1F635
⏸	#9208	#23F8	💭	#128173	#1F4AD	🎗	#127895	#1F397	😶	#128566	#1F636
⏹	#9209	#23F9	💮	#128174	#1F4AE	🎙	#127897	#1F399	😷	#128567	#1F637
⏺	#9210	#23FA	💯	#128175	#1F4AF	🎚	#127898	#1F39A	😸	#128568	#1F638
Ⓜ	#9410	#24C2	💰	#128176	#1F4B0	🎛	#127899	#1F39B	😹	#128569	#1F639
☔	#9748	#2614	💱	#128177	#1F4B1	🎞	#127902	#1F39E	😺	#128570	#1F63A
☕	#9749	#2615	💲	#128178	#1F4B2	🎟	#127903	#1F39F	😻	#128571	#1F63B
☝	#9757	#261D	💳	#128179	#1F4B3	🎠	#127904	#1F3A0	😼	#128572	#1F63C
♈	#9800	#2648	💴	#128180	#1F4B4	🎡	#127905	#1F3A1	😽	#128573	#1F63D
♉	#9801	#2649	💵	#128181	#1F4B5	🎢	#127906	#1F3A2	😾	#128574	#1F63E
♊	#9802	#264A	💶	#128182	#1F4B6	🎣	#127907	#1F3A3	😿	#128575	#1F63F
♋	#9803	#264B	💷	#128183	#1F4B7	🎤	#127908	#1F3A4	🙀	#128576	#1F640
♌	#9804	#264C	💸	#128184	#1F4B8	🎥	#127909	#1F3A5	🙁	#128577	#1F641
♍	#9805	#264D	💹	#128185	#1F4B9	🎦	#127910	#1F3A6	🙂	#128578	#1F642
♎	#9806	#264E	💺	#128186	#1F4BA	🎧	#127911	#1F3A7	🙃	#128579	#1F643
♏	#9807	#264F	💻	#128187	#1F4BB	🎨	#127912	#1F3A8	🙄	#128580	#1F644
♐	#9808	#2650	💼	#128188	#1F4BC	🎩	#127913	#1F3A9	🙅	#128581	#1F645
♑	#9809	#2651	💽	#128189	#1F4BD	🎪	#127914	#1F3AA	🙆	#128582	#1F646
♒	#9810	#2652	💾	#128190	#1F4BE	🎫	#127915	#1F3AB	🙇	#128583	#1F647
♓	#9811	#2653	💿	#128191	#1F4BF	🎬	#127916	#1F3AC	🙈	#128584	#1F648
♟	#9823	#265F	📀	#128192	#1F4C0	🎭	#127917	#1F3AD	🙉	#128585	#1F649
♿	#9855	#267F	📁	#128193	#1F4C1	🎮	#127918	#1F3AE	🙊	#128586	#1F64A
⚓	#9875	#2693	📂	#128194	#1F4C2	🎯	#127919	#1F3AF	🙋	#128587	#1F64B
⚡	#9889	#26A1	📃	#128195	#1F4C3	🎰	#127920	#1F3B0	🙌	#128588	#1F64C
⚪	#9898	#26AA	📄	#128196	#1F4C4	🎱	#127921	#1F3B1	🙍	#128589	#1F64D
⚫	#9899	#26AB	📅	#128197	#1F4C5	🎲	#127922	#1F3B2	🙎	#128590	#1F64E
⚽	#9917	#26BD	📆	#128198	#1F4C6	🎳	#127923	#1F3B3	🙏	#128591	#1F64F
⚾	#9918	#26BE	📇	#128199	#1F4C7	🎴	#127924	#1F3B4	🚀	#128640	#1F680
⛄	#9924	#26C4	📈	#128200	#1F4C8	🎵	#127925	#1F3B5	🚁	#128641	#1F681
⛅	#9925	#26C5	📉	#128201	#1F4C9	🎶	#127926	#1F3B6	🚂	#128642	#1F682
⛎	#9934	#26CE	📊	#128202	#1F4CA	🎷	#127927	#1F3B7	🚃	#128643	#1F683
⛏	#9935	#26CF	📋	#128203	#1F4CB	🎸	#127928	#1F3B8	🚄	#128644	#1F684
⛑	#9937	#26D1	📌	#128204	#1F4CC	🎹	#127929	#1F3B9	🚅	#128645	#1F685
⛓	#9939	#26D3	📍	#128205	#1F4CD	🎺	#127930	#1F3BA	🚆	#128646	#1F686
⛔	#9940	#26D4	📎	#128206	#1F4CE	🎻	#127931	#1F3BB	🚇	#128647	#1F687
⛩	#9961	#26E9	📏	#128207	#1F4CF	🎼	#127932	#1F3BC	🚈	#128648	#1F688
⛪	#9962	#26EA	📐	#128208	#1F4D0	🎽	#127933	#1F3BD	🚉	#128649	#1F689
⛰	#9968	#26F0	📑	#128209	#1F4D1	🎾	#127934	#1F3BE	🚊	#128650	#1F68A
⛱	#9969	#26F1	📒	#128210	#1F4D2	🎿	#127935	#1F3BF	🚋	#128651	#1F68B
⛲	#9970	#26F2	📓	#128211	#1F4D3	🏀	#127936	#1F3C0	🚌	#128652	#1F68C
⛳	#9971	#26F3	📔	#128212	#1F4D4	🏁	#127937	#1F3C1	🚍	#128653	#1F68D
⛴	#9972	#26F4	📕	#128213	#1F4D5	🏂	#127938	#1F3C2	🚎	#128654	#1F68E
⛵	#9973	#26F5	📖	#128214	#1F4D6	🏃	#127939	#1F3C3	🚏	#128655	#1F68F
⛷	#9975	#26F7	📗	#128215	#1F4D7	🏄	#127940	#1F3C4	🚐	#128656	#1F690
⛸	#9976	#26F8	📘	#128216	#1F4D8	🏅	#127941	#1F3C5	🚑	#128657	#1F691
⛹	#9977	#26F9	📙	#128217	#1F4D9	🏆	#127942	#1F3C6	🚒	#128658	#1F692
⛺	#9978	#26FA	📚	#128218	#1F4DA	🏇	#127943	#1F3C7	🚓	#128659	#1F693
⛽	#9981	#26FD	📛	#128219	#1F4DB	🏈	#127944	#1F3C8	🚔	#128660	#1F694
✂	#9986	#2702	📜	#128220	#1F4DC	🏉	#127945	#1F3C9	🚕	#128661	#1F695
✅	#9989	#2705	📝	#128221	#1F4DD	🏊	#127946	#1F3CA	🚖	#128662	#1F696
✈	#9992	#2708	📞	#128222	#1F4DE	🏋	#127947	#1F3CB	🚗	#128663	#1F697
✉	#9993	#2709	📟	#128223	#1F4DF	🏌	#127948	#1F3CC	🚘	#128664	#1F698
✊	#9994	#270A	📠	#128224	#1F4E0	🏍	#127949	#1F3CD	🚙	#128665	#1F699
✋	#9995	#270B	📡	#128225	#1F4E1	🏎	#127950	#1F3CE	🚚	#128666	#1F69A
✌	#9996	#270C	📢	#128226	#1F4E2	🏏	#127951	#1F3CF	🚛	#128667	#1F69B
✍	#9997	#270D	📣	#128227	#1F4E3	🏐	#127952	#1F3D0	🚜	#128668	#1F69C
✏	#9999	#270F	📤	#128228	#1F4E4	🏑	#127953	#1F3D1	🚝	#128669	#1F69D
✒	#10002	#2712	📥	#128229	#1F4E5	🏒	#127954	#1F3D2	🚞	#128670	#1F69E
✔	#10004	#2714	📦	#128230	#1F4E6	🏓	#127955	#1F3D3	🚟	#128671	#1F69F
✖	#10006	#2716	📧	#128231	#1F4E7	🏔	#127956	#1F3D4	🚠	#128672	#1F6A0
✝	#10013	#271D	📨	#128232	#1F4E8	🏕	#127957	#1F3D5	🚡	#128673	#1F6A1
✡	#10017	#2721	📩	#128233	#1F4E9	🏖	#127958	#1F3D6	🚢	#128674	#1F6A2
✨	#10024	#2728	📪	#128234	#1F4EA	🏗	#127959	#1F3D7	🚣	#128675	#1F6A3
✳	#10035	#2733	📫	#128235	#1F4EB	🏘	#127960	#1F3D8	🚤	#128676	#1F6A4
✴	#10036	#2734	📬	#128236	#1F4EC	🏙	#127961	#1F3D9	🚥	#128677	#1F6A5
❄	#10052	#2744	📭	#128237	#1F4ED	🏚	#127962	#1F3DA	🚦	#128678	#1F6A6
❇	#10055	#2747	📮	#128238	#1F4EE	🏛	#127963	#1F3DB	🚧	#128679	#1F6A7
❌	#10060	#274C	📯	#128239	#1F4EF	🏜	#127964	#1F3DC	🚨	#128680	#1F6A8
❎	#10062	#274E	📰	#128240	#1F4F0	🏝	#127965	#1F3DD	🚩	#128681	#1F6A9
❓	#10067	#2753	📱	#128241	#1F4F1	🏞	#127966	#1F3DE	🚪	#128682	#1F6AA
❔	#10068	#2754	📲	#128242	#1F4F2	🏟	#127967	#1F3DF	🚫	#128683	#1F6AB
❕	#10069	#2755	📳	#128243	#1F4F3	🏠	#127968	#1F3E0	🚬	#128684	#1F6AC
❗	#10071	#2757	📴	#128244	#1F4F4	🏡	#127969	#1F3E1	🚭	#128685	#1F6AD
❣	#10083	#2763	📵	#128245	#1F4F5	🏢	#127970	#1F3E2	🚮	#128686	#1F6AE
❤	#10084	#2764	📶	#128246	#1F4F6	🏣	#127971	#1F3E3	🚯	#128687	#1F6AF
➕	#10133	#2795	📷	#128247	#1F4F7	🏤	#127972	#1F3E4	🚰	#128688	#1F6B0
➖	#10134	#2796	📸	#128248	#1F4F8	🏥	#127973	#1F3E5	🚱	#128689	#1F6B1
➗	#10135	#2797	📹	#128249	#1F4F9	🏦	#127974	#1F3E6	🚲	#128690	#1F6B2
➡	#10145	#27A1	📺	#128250	#1F4FA	🏧	#127975	#1F3E7	🚳	#128691	#1F6B3
➰	#10160	#27B0	📻	#128251	#1F4FB	🏨	#127976	#1F3E8	🚴	#128692	#1F6B4
➿	#10175	#27BF	📼	#128252	#1F4FC	🏩	#127977	#1F3E9	🚵	#128693	#1F6B5
⤴	#10548	#2934	📽	#128253	#1F4FD	🏪	#127978	#1F3EA	🚶	#128694	#1F6B6
⤵	#10549	#2935	📿	#128255	#1F4FF	🏫	#127979	#1F3EB	🚷	#128695	#1F6B7
⬅	#11013	#2B05	🔀	#128256	#1F500	🏬	#127980	#1F3EC	🚸	#128696	#1F6B8
⬆	#11014	#2B06	🔁	#128257	#1F501	🏭	#127981	#1F3ED	🚹	#128697	#1F6B9
⬇	#11015	#2B07	🔂	#128258	#1F502	🏮	#127982	#1F3EE	🚺	#128698	#1F6BA
⬛	#11035	#2B1B	🔃	#128259	#1F503	🏯	#127983	#1F3EF	🚻	#128699	#1F6BB
⬜	#11036	#2B1C	🔄	#128260	#1F504	🏰	#127984	#1F3F0	🚼	#128700	#1F6BC
⭐	#11088	#2B50	🔅	#128261	#1F505	🏳	#127987	#1F3F3	🚽	#128701	#1F6BD
⭕	#11093	#2B55	🔆	#128262	#1F506	🏴	#127988	#1F3F4	🚾	#128702	#1F6BE
〰	#12336	#3030	🔇	#128263	#1F507	🏵	#127989	#1F3F5	🚿	#128703	#1F6BF
〽	#12349	#303D	🔈	#128264	#1F508	🏷	#127991	#1F3F7	🛀	#128704	#1F6C0
㊗	#12951	#3297	🔉	#128265	#1F509	🏸	#127992	#1F3F8	🛁	#128705	#1F6C1
㊙	#12953	#3299	🔊	#128266	#1F50A	🏹	#127993	#1F3F9	🛂	#128706	#1F6C2
🀄	#126980	#1F004	🔋	#128267	#1F50B	🏺	#127994	#1F3FA	🛃	#128707	#1F6C3
🃏	#127183	#1F0CF	🔌	#128268	#1F50C	🏻	#127995	#1F3FB	🛄	#128708	#1F6C4
🅰	#127344	#1F170	🔍	#128269	#1F50D	🏼	#127996	#1F3FC	🛅	#128709	#1F6C5
🅱	#127345	#1F171	🔎	#128270	#1F50E	🏽	#127997	#1F3FD	🛋	#128715	#1F6CB
🅾	#127358	#1F17E	🔏	#128271	#1F50F	🏾	#127998	#1F3FE	🛌	#128716	#1F6CC
🅿	#127359	#1F17F	🔐	#128272	#1F510	🏿	#127999	#1F3FF	🛍	#128717	#1F6CD
🆎	#127374	#1F18E	🔑	#128273	#1F511	🐀	#128000	#1F400	🛎	#128718	#1F6CE
🆑	#127377	#1F191	🔒	#128274	#1F512	🐁	#128001	#1F401	🛏	#128719	#1F6CF
🆒	#127378	#1F192	🔓	#128275	#1F513	🐂	#128002	#1F402	🛐	#128720	#1F6D0
🆓	#127379	#1F193	🔔	#128276	#1F514	🐃	#128003	#1F403	🛑	#128721	#1F6D1
🆔	#127380	#1F194	🔕	#128277	#1F515	🐄	#128004	#1F404	🛒	#128722	#1F6D2
🆕	#127381	#1F195	🔖	#128278	#1F516	🐅	#128005	#1F405	🛠	#128736	#1F6E0
🆖	#127382	#1F196	🔗	#128279	#1F517	🐆	#128006	#1F406	🛡	#128737	#1F6E1
🆗	#127383	#1F197	🔘	#128280	#1F518	🐇	#128007	#1F407	🛢	#128738	#1F6E2
🆘	#127384	#1F198	🔙	#128281	#1F519	🐈	#128008	#1F408	🛣	#128739	#1F6E3
🆙	#127385	#1F199	🔚	#128282	#1F51A	🐉	#128009	#1F409	🛤	#128740	#1F6E4
🆚	#127386	#1F19A	🔛	#128283	#1F51B	🐊	#128010	#1F40A	🛥	#128741	#1F6E5
🈁	#127489	#1F201	🔜	#128284	#1F51C	🐋	#128011	#1F40B	🛩	#128745	#1F6E9
🈂	#127490	#1F202	🔝	#128285	#1F51D	🐌	#128012	#1F40C	🛫	#128747	#1F6EB
🈚	#127514	#1F21A	🔞	#128286	#1F51E	🐍	#128013	#1F40D	🛬	#128748	#1F6EC
🈯	#127535	#1F22F	🔟	#128287	#1F51F	🐎	#128014	#1F40E	🛰	#128752	#1F6F0
🈲	#127538	#1F232	🔠	#128288	#1F520	🐏	#128015	#1F40F	🛳	#128755	#1F6F3
🈳	#127539	#1F233	🔡	#128289	#1F521	🐐	#128016	#1F410	🛴	#128756	#1F6F4
🈴	#127540	#1F234	🔢	#128290	#1F522	🐑	#128017	#1F411	🛵	#128757	#1F6F5
🈵	#127541	#1F235	🔣	#128291	#1F523	🐒	#128018	#1F412	🛶	#128758	#1F6F6
🈶	#127542	#1F236	🔤	#128292	#1F524	🐓	#128019	#1F413	🛷	#128759	#1F6F7
🈷	#127543	#1F237	🔥	#128293	#1F525	🐔	#128020	#1F414	🛸	#128760	#1F6F8
🈸	#127544	#1F238	🔦	#128294	#1F526	🐕	#128021	#1F415	🛹	#128761	#1F6F9
🈹	#127545	#1F239	🔧	#128295	#1F527	🐖	#128022	#1F416	🛺	#128762	#1F6FA
🈺	#127546	#1F23A	🔨	#128296	#1F528	🐗	#128023	#1F417	🤐	#129296	#1F910
🉐	#127568	#1F250	🔩	#128297	#1F529	🐘	#128024	#1F418	🤑	#129297	#1F911
🉑	#127569	#1F251	🔪	#128298	#1F52A	🐙	#128025	#1F419	🤒	#129298	#1F912
🌀	#127744	#1F300	🔫	#128299	#1F52B	🐚	#128026	#1F41A	🤓	#129299	#1F913
🌁	#127745	#1F301	🔬	#128300	#1F52C	🐛	#128027	#1F41B	🤔	#129300	#1F914
🌂	#127746	#1F302	🔭	#128301	#1F52D	🐜	#128028	#1F41C	🤕	#129301	#1F915
🌃	#127747	#1F303	🔮	#128302	#1F52E	🐝	#128029	#1F41D	🤖	#129302	#1F916
🌄	#127748	#1F304	🔯	#128303	#1F52F	🐞	#128030	#1F41E	🤗	#129303	#1F917
🌅	#127749	#1F305	🔰	#128304	#1F530	🐟	#128031	#1F41F	🤘	#129304	#1F918
🌆	#127750	#1F306	🔱	#128305	#1F531	🐠	#128032	#1F420	🤙	#129305	#1F919
🌇	#127751	#1F307	🔲	#128306	#1F532	🐡	#128033	#1F421	🤚	#129306	#1F91A
🌈	#127752	#1F308	🔳	#128307	#1F533	🐢	#128034	#1F422	🤛	#129307	#1F91B
🌉	#127753	#1F309	🔴	#128308	#1F534	🐣	#128035	#1F423	🤜	#129308	#1F91C
🌊	#127754	#1F30A	🔵	#128309	#1F535	🐤	#128036	#1F424	🤝	#129309	#1F91D
🌋	#127755	#1F30B	🔶	#128310	#1F536	🐥	#128037	#1F425	🤞	#129310	#1F91E
🌌	#127756	#1F30C	🔷	#128311	#1F537	🐦	#128038	#1F426	🤟	#129311	#1F91F
🌍	#127757	#1F30D	🔸	#128312	#1F538	🐧	#128039	#1F427	🤠	#129312	#1F920
🌎	#127758	#1F30E	🔹	#128313	#1F539	🐨	#128040	#1F428	🤡	#129313	#1F921
🌏	#127759	#1F30F	🔺	#128314	#1F53A	🐩	#128041	#1F429	🤢	#129314	#1F922
🌐	#127760	#1F310	🔻	#128315	#1F53B	🐪	#128042	#1F42A	🤣	#129315	#1F923
🌑	#127761	#1F311	🔼	#128316	#1F53C	🐫	#128043	#1F42B	🤤	#129316	#1F924
🌒	#127762	#1F312	🔽	#128317	#1F53D	🐬	#128044	#1F42C	🤥	#129317	#1F925
🌓	#127763	#1F313	🕉	#128329	#1F549	🐭	#128045	#1F42D	🤦	#129318	#1F926
🌔	#127764	#1F314	🕊	#128330	#1F54A	🐮	#128046	#1F42E	🤧	#129319	#1F927
🌕	#127765	#1F315	🕋	#128331	#1F54B	🐯	#128047	#1F42F	🤨	#129320	#1F928
🌖	#127766	#1F316	🕌	#128332	#1F54C	🐰	#128048	#1F430	🤩	#129321	#1F929
🌗	#127767	#1F317	🕍	#128333	#1F54D	🐱	#128049	#1F431	🤪	#129322	#1F92A
🌘	#127768	#1F318	🕎	#128334	#1F54E	🐲	#128050	#1F432	🤫	#129323	#1F92B
🌙	#127769	#1F319	🕐	#128336	#1F550	🐳	#128051	#1F433	🤬	#129324	#1F92C
🌚	#127770	#1F31A	🕑	#128337	#1F551	🐴	#128052	#1F434	🤭	#129325	#1F92D
🌛	#127771	#1F31B	🕒	#128338	#1F552	🐵	#128053	#1F435	🤮	#129326	#1F92E
🌜	#127772	#1F31C	🕓	#128339	#1F553	🐶	#128054	#1F436	🤯	#129327	#1F92F
🌝	#127773	#1F31D	🕔	#128340	#1F554	🐷	#128055	#1F437	🤰	#129328	#1F930
🌞	#127774	#1F31E	🕕	#128341	#1F555	🐸	#128056	#1F438	🤱	#129329	#1F931
🌟	#127775	#1F31F	🕖	#128342	#1F556	🐹	#128057	#1F439	🤲	#129330	#1F932
🌠	#127776	#1F320	🕗	#128343	#1F557	🐺	#128058	#1F43A	🤳	#129331	#1F933
🌡	#127777	#1F321	🕘	#128344	#1F558	🐻	#128059	#1F43B	🤴	#129332	#1F934
🌤	#127780	#1F324	🕙	#128345	#1F559	🐼	#128060	#1F43C	🤵	#129333	#1F935
🌥	#127781	#1F325	🕚	#128346	#1F55A	🐽	#128061	#1F43D	🤶	#129334	#1F936
🌦	#127782	#1F326	🕛	#128347	#1F55B	🐾	#128062	#1F43E	🤷	#129335	#1F937
🌧	#127783	#1F327	🕜	#128348	#1F55C	🐿	#128063	#1F43F	🤸	#129336	#1F938
🌨	#127784	#1F328	🕝	#128349	#1F55D	👀	#128064	#1F440	🤹	#129337	#1F939
🌩	#127785	#1F329	🕞	#128350	#1F55E	👁	#128065	#1F441	🤺	#129338	#1F93A
🌪	#127786	#1F32A	🕟	#128351	#1F55F	👂	#128066	#1F442	🤼	#129340	#1F93C
🌫	#127787	#1F32B	🕠	#128352	#1F560	👃	#128067	#1F443	🤽	#129341	#1F93D
🌬	#127788	#1F32C	🕡	#128353	#1F561	👄	#128068	#1F444	🤾	#129342	#1F93E
🌭	#127789	#1F32D	🕢	#128354	#1F562	👅	#128069	#1F445	🥀	#129344	#1F940
🌮	#127790	#1F32E	🕣	#128355	#1F563	👆	#128070	#1F446	🥁	#129345	#1F941
🌯	#127791	#1F32F	🕤	#128356	#1F564	👇	#128071	#1F447	🥂	#129346	#1F942
🌰	#127792	#1F330	🕥	#128357	#1F565	👈	#128072	#1F448	🥃	#129347	#1F943
🌱	#127793	#1F331	🕦	#128358	#1F566	👉	#128073	#1F449	🥄	#129348	#1F944
🌲	#127794	#1F332	🕧	#128359	#1F567	👊	#128074	#1F44A	🥅	#129349	#1F945
🌳	#127795	#1F333	🕯	#128367	#1F56F	👋	#128075	#1F44B	🥇	#129351	#1F947
🌴	#127796	#1F334	🕰	#128368	#1F570	👌	#128076	#1F44C	🥈	#129352	#1F948
🌵	#127797	#1F335	🕳	#128371	#1F573	👍	#128077	#1F44D	🥉	#129353	#1F949
🌶	#127798	#1F336	🕴	#128372	#1F574	👎	#128078	#1F44E	🥊	#129354	#1F94A
🌷	#127799	#1F337	🕵	#128373	#1F575	👏	#128079	#1F44F	🥋	#129355	#1F94B
🌸	#127800	#1F338	🕶	#128374	#1F576	👐	#128080	#1F450	🥌	#129356	#1F94C
🌹	#127801	#1F339	🕷	#128375	#1F577	👑	#128081	#1F451	🥍	#129357	#1F94D
🌺	#127802	#1F33A	🕸	#128376	#1F578	👒	#128082	#1F452	🥎	#129358	#1F94E
🌻	#127803	#1F33B	🕹	#128377	#1F579	👓	#128083	#1F453	🥏	#129359	#1F94F
🌼	#127804	#1F33C	🕺	#128378	#1F57A	👔	#128084	#1F454	🥐	#129360	#1F950
🌽	#127805	#1F33D	🖇	#128391	#1F587	👕	#128085	#1F455	🥑	#129361	#1F951
🌾	#127806	#1F33E	🖊	#128394	#1F58A	👖	#128086	#1F456	🥒	#129362	#1F952
🌿	#127807	#1F33F	🖋	#128395	#1F58B	👗	#128087	#1F457	🥓	#129363	#1F953
🍀	#127808	#1F340	🖌	#128396	#1F58C	👘	#128088	#1F458	🥔	#129364	#1F954
🍁	#127809	#1F341	🖍	#128397	#1F58D	👙	#128089	#1F459	🥕	#129365	#1F955
🍂	#127810	#1F342	🖐	#128400	#1F590	👚	#128090	#1F45A	🥖	#129366	#1F956
🍃	#127811	#1F343	🖕	#128405	#1F595	👛	#128091	#1F45B	🥗	#129367	#1F957
🍄	#127812	#1F344	🖖	#128406	#1F596	👜	#128092	#1F45C	🥘	#129368	#1F958
🍅	#127813	#1F345	🖤	#128420	#1F5A4	👝	#128093	#1F45D	🥙	#129369	#1F959
🍆	#127814	#1F346	🖥	#128421	#1F5A5	👞	#128094	#1F45E	🥚	#129370	#1F95A
🍇	#127815	#1F347	🖨	#128424	#1F5A8	👟	#128095	#1F45F	🥛	#129371	#1F95B
🍈	#127816	#1F348	🖱	#128433	#1F5B1	👠	#128096	#1F460	🥜	#129372	#1F95C
🍉	#127817	#1F349	🖲	#128434	#1F5B2	👡	#128097	#1F461	🥝	#129373	#1F95D
🍊	#127818	#1F34A	🖼	#128444	#1F5BC	👢	#128098	#1F462	🥞	#129374	#1F95E
🍋	#127819	#1F34B	🗂	#128450	#1F5C2	👣	#128099	#1F463	🥟	#129375	#1F95F
🍌	#127820	#1F34C	🗃	#128451	#1F5C3	👤	#128100	#1F464	🥠	#129376	#1F960
🍍	#127821	#1F34D	🗄	#128452	#1F5C4	👥	#128101	#1F465	🥡	#129377	#1F961
🍎	#127822	#1F34E	🗑	#128465	#1F5D1	👦	#128102	#1F466	🥢	#129378	#1F962
🍏	#127823	#1F34F	🗒	#128466	#1F5D2	👧	#128103	#1F467	🥣	#129379	#1F963
🍐	#127824	#1F350	🗓	#128467	#1F5D3	👨	#128104	#1F468	🥤	#129380	#1F964
🍑	#127825	#1F351	🗜	#128476	#1F5DC	👩	#128105	#1F469	🥥	#129381	#1F965
🍒	#127826	#1F352	🗝	#128477	#1F5DD	👪	#128106	#1F46A	🥦	#129382	#1F966
🍓	#127827	#1F353	🗞	#128478	#1F5DE	👫	#128107	#1F46B	🥧	#129383	#1F967
🍔	#127828	#1F354	🗡	#128481	#1F5E1	👬	#128108	#1F46C	🥨	#129384	#1F968
🍕	#127829	#1F355	🗣	#128483	#1F5E3	👭	#128109	#1F46D	🥩	#129385	#1F969
🍖	#127830	#1F356	🗨	#128488	#1F5E8	👮	#128110	#1F46E	🥪	#129386	#1F96A
🍗	#127831	#1F357	🗯	#128495	#1F5EF	👯	#128111	#1F46F	🥫	#129387	#1F96B
🍘	#127832	#1F358	🗳	#128499	#1F5F3	👰	#128112	#1F470	🦀	#129408	#1F980
🍙	#127833	#1F359	🗺	#128506	#1F5FA	👱	#128113	#1F471	🦁	#129409	#1F981
🍚	#127834	#1F35A	🗻	#128507	#1F5FB	👲	#128114	#1F472	🦂	#129410	#1F982
🍛	#127835	#1F35B	🗼	#128508	#1F5FC	👳	#128115	#1F473	🦃	#129411	#1F983
🍜	#127836	#1F35C	🗽	#128509	#1F5FD	👴	#128116	#1F474	🦄	#129412	#1F984
🍝	#127837	#1F35D	🗾	#128510	#1F5FE	👵	#128117	#1F475	🦅	#129413	#1F985
🍞	#127838	#1F35E	🗿	#128511	#1F5FF	👶	#128118	#1F476	🦆	#129414	#1F986
🍟	#127839	#1F35F	😀	#128512	#1F600	👷	#128119	#1F477	🦇	#129415	#1F987
🍠	#127840	#1F360	😁	#128513	#1F601	👸	#128120	#1F478	🦈	#129416	#1F988
🍡	#127841	#1F361	😂	#128514	#1F602	👹	#128121	#1F479	🦉	#129417	#1F989
🍢	#127842	#1F362	😃	#128515	#1F603	👺	#128122	#1F47A	🦊	#129418	#1F98A
🍣	#127843	#1F363	😄	#128516	#1F604	👻	#128123	#1F47B	🦋	#129419	#1F98B
🍤	#127844	#1F364	😅	#128517	#1F605	👼	#128124	#1F47C	🦌	#129420	#1F98C
🍥	#127845	#1F365	😆	#128518	#1F606	👽	#128125	#1F47D	🦍	#129421	#1F98D
🍦	#127846	#1F366	😇	#128519	#1F607	👾	#128126	#1F47E	🦎	#129422	#1F98E
🍧	#127847	#1F367	😈	#128520	#1F608	👿	#128127	#1F47F	🦏	#129423	#1F98F
🍨	#127848	#1F368	😉	#128521	#1F609	💀	#128128	#1F480	🦐	#129424	#1F990
🍩	#127849	#1F369	😊	#128522	#1F60A	💁	#128129	#1F481	🦑	#129425	#1F991
🍪	#127850	#1F36A	😋	#128523	#1F60B	💂	#128130	#1F482	🦒	#129426	#1F992
🍫	#127851	#1F36B	😌	#128524	#1F60C	💃	#128131	#1F483	🦓	#129427	#1F993
🍬	#127852	#1F36C	😍	#128525	#1F60D	💄	#128132	#1F484	🦔	#129428	#1F994
🍭	#127853	#1F36D	😎	#128526	#1F60E	💅	#128133	#1F485	🦕	#129429	#1F995
🍮	#127854	#1F36E	😏	#128527	#1F60F	💆	#128134	#1F486	🦖	#129430	#1F996
🍯	#127855	#1F36F	😐	#128528	#1F610	💇	#128135	#1F487	🦗	#129431	#1F997
🍰	#127856	#1F370	😑	#128529	#1F611	💈	#128136	#1F488	🧀	#129472	#1F9C0
🍱	#127857	#1F371	😒	#128530	#1F612	💉	#128137	#1F489	🧐	#129488	#1F9D0
🍲	#127858	#1F372	😓	#128531	#1F613	💊	#128138	#1F48A	🧑	#129489	#1F9D1
🍳	#127859	#1F373	😔	#128532	#1F614	💋	#128139	#1F48B	🧒	#129490	#1F9D2
🍴	#127860	#1F374	😕	#128533	#1F615	💌	#128140	#1F48C	🧓	#129491	#1F9D3
🍵	#127861	#1F375	😖	#128534	#1F616	💍	#128141	#1F48D	🧔	#129492	#1F9D4
🍶	#127862	#1F376	😗	#128535	#1F617	💎	#128142	#1F48E	🧕	#129493	#1F9D5
🍷	#127863	#1F377	😘	#128536	#1F618	💏	#128143	#1F48F	🧖	#129494	#1F9D6
🍸	#127864	#1F378	😙	#128537	#1F619	💐	#128144	#1F490	🧗	#129495	#1F9D7
🍹	#127865	#1F379	😚	#128538	#1F61A	💑	#128145	#1F491	🧘	#129496	#1F9D8
🍺	#127866	#1F37A	😛	#128539	#1F61B	💒	#128146	#1F492	🧙	#129497	#1F9D9
🍻	#127867	#1F37B	😜	#128540	#1F61C	💓	#128147	#1F493	🧚	#129498	#1F9DA
🍼	#127868	#1F37C	😝	#128541	#1F61D	💔	#128148	#1F494	🧛	#129499	#1F9DB
🍽	#127869	#1F37D	😞	#128542	#1F61E	💕	#128149	#1F495	🧜	#129500	#1F9DC
🍾	#127870	#1F37E	😟	#128543	#1F61F	💖	#128150	#1F496	🧝	#129501	#1F9DD
🍿	#127871	#1F37F	😠	#128544	#1F620	💗	#128151	#1F497	🧞	#129502	#1F9DE
🎀	#127872	#1F380	😡	#128545	#1F621	💘	#128152	#1F498	🧟	#129503	#1F9DF
🎁	#127873	#1F381	😢	#128546	#1F622	💙	#128153	#1F499	🧠	#129504	#1F9E0
🎂	#127874	#1F382	😣	#128547	#1F623	💚	#128154	#1F49A	🧡	#129505	#1F9E1
🎃	#127875	#1F383	😤	#128548	#1F624	💛	#128155	#1F49B	🧢	#129506	#1F9E2
🎄	#127876	#1F384	😥	#128549	#1F625	💜	#128156	#1F49C	🧣	#129507	#1F9E3
🎅	#127877	#1F385	😦	#128550	#1F626	💝	#128157	#1F49D	🧤	#129508	#1F9E4
🎆	#127878	#1F386	😧	#128551	#1F627	💞	#128158	#1F49E	🧥	#129509	#1F9E5
🎇	#127879	#1F387	😨	#128552	#1F628	💟	#128159	#1F49F	🧦	#129510	#1F9E6

🔼

Links úteis relacionados:

Tecnologias Web

Posted on 23/09/202218/10/2022 by Guilherme

Plataformas WEB

Uma plataforma WEB é uma coleção de tecnologias desenvolvidas para a criação, desenvolvimento e distribuição de páginas e aplicativos na internet.

Front End

Elas envolvem tecnologias de níveis variados de complexidade sendo que as mais básicas, e mais amplamente empregadas, são a linguagem HTML, Hyper Text Markup Language e CSS, Cascade Style Sheets. HTML é responsável pela estrutura de uma página, marcando títulos, parágrafos, links, blocos de texto, inserção de imagens, etc. CSS são arquivos de formatação, usados para definir tamanhos e tipos de fontes, cores, espaçamentos, etc. A linguagem javascript é usada pela maioria dos sites para executar ações do lado do navegador, tais como atualização dinâmica de conteúdo, envio de respostas do usuário para o servidor e controle de arquivos multimídia. Diversas novas tecnologias são baseadas no javascript, como AngularJS, Node.js e React.

Back End

Além das tecnologias usadas no navegador quase sempre é necessário usar linguagens de programação que alteram a construção de páginas e aplicativos no lado do servidor. O acesso a um banco de dados é a utilização mais comum. As mais empregadas são o PHP, Java, Python, Ruby on Rails e ASP.Net. Cada uma delas oferece um número de plataformas, cada em com suas vantagens e desvantagens, como agilidade de desenvolvimento e velocidade de resposta das páginas. As plataformas são basicamente ambientes desenvolvidos para resolver problemas determinados. Por ex., o PHP é a base de CMSs como o WordPress, útil para a construção de blogs e exibição de textos, ou desenvolvimento de sites de vendas online. O Python é usado na plataforma Django, criado e muito empregado nos sites de jornalismo, onde as atualizações devem ser rápidas e constantes. Todas essas tecnologias demandam algum tempo de aprendizado.

A Arquitetura básica da Web

Partindo do usuário, a web é vista primeiro em um navegador, como o Firefox, Chrome ou Safari. O navegador envia uma URL para a rede e recebe em resposta páginas HTML, arquivos de estilo CSS, arquivos Javascript e de multimídia, como áudios e vídeos. O navegador é um aplicativo que pode agrupar esse conteúdo e apresentá-los de forma compreensível. Navegadores modernos podem exibir outros formatos de arquivo, como pdf e planilhas, nativamente ou por meio de plugins. Além disso eles podem interpretar e executar código javascript, também recebidos do servidor.

A requisição do cliente (o navegador) contém o endereço do servidor que são computadores dedicados à esse serviço em diversas partes do mundo. O servidor recebe a solicitação e monta uma resposta. Para isso ele pode usar diversas tecnologias diferentes, acesso a banco de dados, código de frameworks montadores de páginas, etc. O servidor pode, por sua vez, acessar outros servidores para montar o conteúdo que será enviado para o cliente. O resultado será uma página em formato HTML gerada pelo servidor e apropriada para ser exibida.

Para a comunicação entre cliente e servidor é usado o HTTP, um protocolo de transferência de hipertexto que define como dados devem trafegar na rede. O HTTPS é um aperfeiçoamento que adiciona uma camada de segurança entre a emissão e resposta. Páginas HTML enviadas pelo servidor podem ser estáticas, enviadas como estão gravadas, sem processamento. O mais comum hoje é que as páginas sejam dinâmicas, montadas por solicitação, processadas por código de programa, geralmente ASP ou .NET, Java, Rails ou Python. Um servidor de aplicativos é o mecanismo que executa a lógica de negócios no lado do servidor que, em geral, está separado do servidor de páginas.

Tabela de cores Html e CSS

Posted on 04/10/202118/10/2022 by Guilherme

As bibliotecas gráficas do Python, Matplotlib, Seaborn e Bokeh aceitam cores no sistema css e a maioria dos nomes ou shortcuts. O código hexadecimal é formado por 3 números, de 0 até 255 (ou 00 até FF), para daterminar a intensidade das cores R, G, B (vermelho, verde, azul). Dessa forma FFFFFF representa (255, 255, 255), ou branco; 000000 representa (0, 0, 0) ou preto. FF0000 é vermelho puro, 00FF00 é verde puro, 0000FF é azul puro. Além disso se pode utilizar o parâmetro alpha=a, onde 0 ≤ a ≤1 para a opacidade da cor, sendo 1 opacidade máxima.

Cores podem ser definidas como:

no formato hexadecimal (como #123456), com strings do CSS4 rgb(), rgba() ou hsl(): como rgb(0 127 0 / 1.0), rgba(255, 0, 127, 0.6) ou hsl(60deg 100% 50% / 1.0).
como tupla de inteiros (r, g, b), onde r, g, b são inteiros entre 0 e 255.
como a tuple (r, g, b, a), onde r, g, b são inteiros entre 0 e 255 e a é número de ponto flutuante entre 0 e 1.
um inteiro sem sinal representando RGBA values no padrão 0xRRGGBBAA, 0xffff00ff ou 0xff0000ff.

Segue uma tabela com as cores em código hexadecimal e seu nome.

Hexadecimal	Html/CSS	Hexadecimal	Html/CSS	Hexadecimal	Html/CSS
#000000	Black	#000080	Navy	#00008B	DarkBlue
#0000CD	MediumBlue	#0000FF	Blue	#006400	DarkGreen
#008000	Green	#008080	Teal	#008B8B	DarkCyan
#00BFFF	DeepSkyBlue	#00CED1	DarkTurquoise	#00FA9A	MediumSpringGreen
#00FF00	Lime	#00FF7F	SpringGreen	#00FFFF	Aqua
#00FFFF	Cyan	#191970	MidnightBlue	#1E90FF	DodgerBlue
#20B2AA	LightSeaGreen	#228B22	ForestGreen	#2E8B57	SeaGreen
#2F4F4F	DarkSlateGray	#2F4F4F	DarkSlateGrey	#32CD32	LimeGreen
#3CB371	MediumSeaGreen	#40E0D0	Turquoise	#4169E1	RoyalBlue
#4682B4	SteelBlue	#483D8B	DarkSlateBlue	#48D1CC	MediumTurquoise
#4B0082	Indigo	#556B2F	DarkOliveGreen	#5F9EA0	CadetBlue
#6495ED	CornflowerBlue	#663399	RebeccaPurple	#66CDAA	MediumAquaMarine
#696969	DimGray	#696969	DimGrey	#6A5ACD	SlateBlue
#6B8E23	OliveDrab	#708090	SlateGray	#708090	SlateGrey
#778899	LightSlateGray	#778899	LightSlateGrey	#7B68EE	MediumSlateBlue
#7CFC00	LawnGreen	#7FFF00	Chartreuse	#7FFFD4	Aquamarine
#800000	Maroon	#800080	Purple	#808000	Olive
#808080	Gray	#808080	Grey	#87CEEB	SkyBlue
#87CEFA	LightSkyBlue	#8A2BE2	BlueViolet	#8B0000	DarkRed
#8B008B	DarkMagenta	#8B4513	SaddleBrown	#8FBC8F	DarkSeaGreen
#90EE90	LightGreen	#9370DB	MediumPurple	#9400D3	DarkViolet
#98FB98	PaleGreen	#9932CC	DarkOrchid	#9ACD32	YellowGreen
#A0522D	Sienna	#A52A2A	Brown	#A9A9A9	DarkGray
#A9A9A9	DarkGrey	#ADD8E6	LightBlue	#ADFF2F	GreenYellow
#AFEEEE	PaleTurquoise	#B0C4DE	LightSteelBlue	#B0E0E6	PowderBlue
#B22222	FireBrick	#B8860B	DarkGoldenRod	#BA55D3	MediumOrchid
#BC8F8F	RosyBrown	#BDB76B	DarkKhaki	#C0C0C0	Silver
#C71585	MediumVioletRed	#CD5C5C	IndianRed	#CD853F	Peru
#D2691E	Chocolate	#D2B48C	Tan	#D3D3D3	LightGray
#D3D3D3	LightGrey	#D8BFD8	Thistle	#DA70D6	Orchid
#DAA520	GoldenRod	#DB7093	PaleVioletRed	#DC143C	Crimson
#DCDCDC	Gainsboro	#DDA0DD	Plum	#DEB887	BurlyWood
#E0FFFF	LightCyan	#E6E6FA	Lavender	#E9967A	DarkSalmon
#EE82EE	Violet	#EEE8AA	PaleGoldenRod	#F08080	LightCoral
#F0E68C	Khaki	#F0F8FF	AliceBlue	#F0FFF0	HoneyDew
#F0FFFF	Azure	#F4A460	SandyBrown	#F5DEB3	Wheat
#F5F5DC	Beige	#F5F5F5	WhiteSmoke	#F5FFFA	MintCream
#F8F8FF	GhostWhite	#FA8072	Salmon	#FAEBD7	AntiqueWhite
#FAF0E6	Linen	#FAFAD2	LightGoldenRodYellow	#FDF5E6	OldLace
#FF0000	Red	#FF00FF	Fuchsia	#FF00FF	Magenta
#FF1493	DeepPink	#FF4500	OrangeRed	#FF6347	Tomato
#FF69B4	HotPink	#FF7F50	Coral	#FF8C00	DarkOrange
#FFA07A	LightSalmon	#FFA500	Orange	#FFB6C1	LightPink
#FFC0CB	Pink	#FFD700	Gold	#FFDAB9	PeachPuff
#FFDEAD	NavajoWhite	#FFE4B5	Moccasin	#FFE4C4	Bisque
#FFE4E1	MistyRose	#FFEBCD	BlanchedAlmond	#FFEFD5	PapayaWhip
#FFF0F5	LavenderBlush	#FFF5EE	SeaShell	#FFF8DC	Cornsilk
#FFFACD	LemonChiffon	#FFFAF0	FloralWhite	#FFFAFA	Snow
#FFFF00	Yellow	#FFFFE0	LightYellow	#FFFFF0	Ivory
#FFFFFF	White

`Propriedades`	`Métodos`	`Eventos`
auto_scroll, appbar, banner, bgcolor, client_ip, client_user_agent, controls, dark_theme, dialog, floating_action_button, fonts, height, horizontal_alignment, on_scroll_interval, overlay, padding, platform, pubsub, pwa, route, rtl, scroll, session_id, spacing, splash, show_semantics_debugger, theme, theme_mode, title, vertical_alignment, views, web, width, window_always_on_top, window_bgcolor, window_focused, window_frameless, window_full_screen, window_height, window_left, window_maximizable, window_maximized, window_max_height, window_max_width, window_minimizable, window_minimized, window_min_height, window_min_width, window_movable, window_opacity, window_resizable, window_title_bar_hidden, window_title_bar_buttons_hidden, window_top, window_prevent_close, window_progress_bar, window_skip_task_bar, window_visible, window_width	can_launch_url(url), close_banner(), close_bottom_sheet(), close_dialog(), close_in_app_web_view(), get_clipboard(), go(route), launch_url(url), page.get_upload_url(file_name, expires), scroll_to(offset, delta, key, duration, curve), set_clipboard(data), show_banner(banner: Banner), show_bottom_sheet(bottom_sheet: BottomSheet), show_dialog(dialog: AlertDialog), show_snack_bar(snack_bar: SnackBar), window_center(), window_close(), window_destroy(), window_to_front()	on_close, on_connect, on_disconnect, on_error, on_keyboard_event, on_resize, on_route_change, on_scroll, on_view_pop, on_window_event

Flet, Layout: Page

Flet, Layout: Page

Propriedades, métodos e eventos de page

Propriedades de page

Métodos de page

Eventos de page

Bibiografia

Python com Flet: Widgets

Widgets, propriedades e eventos

Buttons (botões)

Ícones

Bibiografia

Python com Flet: Widgets

Widgets, propriedades e eventos

Categorias de Controles

Propriedades comuns a vários controles

Transformações (Transformations)

Exemplo de uso das Propriedades e Transformações

Atalhos de Teclado

Bibiografia

Python: Flet

Flet: Flutter para Python

Flutter e Widgets

Instalando o Flet

Inserindo Widgets

Outro Exemplo: Controles e propriedades

Bibiografia

Caracteres HTML

Links úteis relacionados:

Plataformas WEB

Front End

Back End

A Arquitetura básica da Web