Tappity Brand: Colors, Fonts, Logo & Visual Identity

Tappity Brand Identity

A complete profile of Tappity's visual system — colors, typography, components, and personality — extracted from https://www.tappityapp.com. Built for designers, agents, and AI tools.

Color Palette

Brand palette extracted from https://www.tappityapp.com.

Primary: #5931EA
Secondary: #DDD4FF
Accent: #290C79
Background: #FFFFFF
Text Primary: #666666
Link: #2E0784

Typography

Each font links to its Google Fonts page where available.

Primary: Hanken Grotesk (Google Fonts →)
Heading: Hanken Grotesk (Google Fonts →)
Font Stack: Hanken Grotesk, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, sans-serif

Visual Assets

UI Components

Live previews rendered using Tappity's actual button styles.

Input

Background: #FFFFFF
Text Color: #3B333F
Border Color: #FFFFFF
Border Radius: 12px
Shadow: rgba(0, 0, 0, 0.15) 0px 8px 18px -3px, rgba(0, 0, 0, 0.2) 0px 4px 8px -2px

Button Primary

Background: #290C79
Text Color: #FFFFFF
Border Radius: 9999px
Shadow: rgba(89, 49, 234, 0.2) 0px 6px 16px 0px, rgba(255, 255, 255, 0.1) 0px 1px 0px 0px inset, rgba(255, 255, 255, 0.1) 0px -2px 4px 0px inset

Button Secondary

Background: #DDD4FF
Text Color: #5931EA
Border Radius: 80px
Shadow: none

Brand Personality

Tone: playful
Energy: high
Audience: homeschoolers and children interested in science

Tappity Brand in the Wild

Source: shop.tappityapp.com

Frequently Asked Questions

What is Tappity's primary brand color?
Tappity's primary brand color is #5931EA. It anchors the visual identity across their website, product UI, and marketing materials.
What accent color does Tappity use?
Tappity uses #290C79 as an accent color, typically applied to interactive elements like links, buttons, and call-to-action emphasis.
What font does Tappity use?
Tappity uses Hanken Grotesk as the primary typeface across body and headings.
Does Tappity use a light or dark theme?
Tappity's primary site uses a light color scheme, with a background of #FFFFFF.
Where can I find Tappity's logo?
Tappity's logo is available directly on their site (https://www.tappityapp.com). The current logo URL is included in the machine-readable JSON profile linked above.
How was this brand profile generated?
This profile was extracted from https://www.tappityapp.com using the Firecrawl branding extraction API, which inspects the live page's CSS, fonts, color tokens, and component styles. It is not affiliated with or endorsed by Tappity.