Dashboard visuals is the craft layer: the typography, iconography, spacing, and polish that turns a collection of charts into a legible page. Strkr's visuals follow a tight system (four type sizes, a reserved signal palette, a calibrated spacing scale) so every dashboard reads with the same voice and every reader builds muscle memory for the surface.
Dashboard visuals start with typography. A dashboard with twelve different type sizes reads as noise. One with four reads as composition. Strkr's type scale is tight by design: display for anchor numbers, headline for section titles, body for chart labels, and small for metadata. The scale is shared across every dashboard in the organisation so readers never retune.
Anchor numbers use the display scale: 48 to 72 pixels on desktop, 32 to 48 on mobile, 96 to 128 on wall displays. The number earns the top of the page by being the first thing a reader sees. The size is intentional.
Section titles and tile headers use the headline scale: 20 to 24 pixels on desktop. The scale carries weight and clarity, giving the dashboard a navigable rhythm. The reader scans section titles and locates the band they need.
Chart labels, axis titles, and tile descriptions use the body scale: 14 to 16 pixels on desktop. The size balances legibility with density. The reader reads a chart without squinting.
Metadata, timestamps, record counts, and footer notes use the small scale: 12 to 13 pixels on desktop. The size signals supporting information without competing with the primary content. Secondary information stays secondary.
Tabular numbers in tables use a monospace or tabular-figures font so columns line up neatly. The reader scans a column and reads values without being distracted by variable glyph widths. Alignment is a feature of the type system.
The type scale is identical across every dashboard in the organisation. Readers who move between dashboards do not retune their reading. The visual language compounds trust and comprehension over time.
Dashboard visuals use icons sparingly and consistently. Strkr's icon system reserves iconography for signals, status, and actions. Each icon has a single meaning that holds across every dashboard. Icons never decorate; they communicate. The reader learns the icon vocabulary once and reads every subsequent dashboard faster.
Variance chips carry up or down arrows for direction and a tilde glyph for flat. The icons pair with colour (green, amber, red) so state is doubly communicated. Colourblind readers get the shape; sighted readers get both.
Each tile carries a status icon in its header: live for real-time, cached for stored, scheduled for refresh-on-cadence, broken for unavailable. The reader scans the dashboard and spots the broken tile without clicking anything.
Hover affordances surface action icons: drill into records, apply filter, share link, export CSV. The icons are the same on every tile. The reader learns them once and uses them everywhere. Action is a shared vocabulary.
Drill tables and record previews carry small entity icons: account, deal, case, contact. The icons help the reader orient quickly on dense lists. The system's entity vocabulary becomes visible.
The icon system refuses decorative icons that fill empty space without communicating. If a tile has nothing to say, the empty state is the message, not a cheerful mascot. Icons earn their place by meaning.
The icon vocabulary is identical across dashboards, email reports, Slack cards, and mobile push alerts. The reader reads a push notification and recognises the signal immediately. Consistency builds trust.
Dashboard visuals succeed when spacing has a plan. Strkr's canvas uses a calibrated spacing scale: consistent gutters, consistent padding, consistent line height. The reader's eye flows naturally from one tile to the next without hunting. Dense dashboards stay legible because the whitespace is intentional, not accidental.
Tiles sit with consistent horizontal and vertical gutters on the twelve-column grid. The gutter scale is proportional to the viewport: tighter on mobile, more generous on desktop, more generous still on wall displays. The visual rhythm scales.
Each tile carries consistent interior padding so content never crashes into tile edges. The padding scale matches the type scale so the ratio of ink to space stays constant. The reader's eye finds the content inside the frame.
Anchors, trends, and drills sit in three visually distinct bands with subtle background changes and generous vertical spacing. The reader scrolling knows which band they are in. The three-band rhythm turns a dashboard into a legible page.
Tile descriptions and prose use a line height tuned for reading (1.5x on body, 1.3x on headlines). Dense text stays legible. Short labels sit tight. The system respects the kind of content being rendered.
Charts sit with explicit margins between the plot area and the tile edge. Axis labels have room to render without clipping. The chart carries context without being crammed. The margin is intentional.
The canvas refuses tile placements that would crowd neighbours below the spacing minimums. The maker gets a visible snap guide instead of a cramped layout. Spacing discipline is enforced, not advised.
Dashboard visuals read as polished through dozens of small details: a loading skeleton that preserves shape, an empty state that reads cleanly, a tooltip that aligns to the pointer, a transition that lands under 250 milliseconds. Strkr's tiles ship with those details tuned by default. The maker inherits polish without having to specify every pixel.
While a tile loads, a skeleton of the final layout renders instead of a spinner. The reader sees the shape of what will arrive and does not stare at a blank. The skeleton is the same colour family as the tile it previews.
When a tile has no data to render, the empty state carries the reason: no sales in this period, no accounts matched this filter, no closed deals this week. The copy is honest. The reader never sees an unexplained blank chart.
When a tile fails to load, the error state carries a short message, an owner contact, and a retry affordance. The reader never sees a technical stack trace or a broken element. Failures are communicated like features.
Tooltips align precisely to the chart mark being hovered. The arrow points at the data point. The tooltip stays within the viewport. Nothing floats off-screen or obscures the data behind it.
Hover states apply a subtle elevation or tint change that signals interactivity. The transition is under 150ms. The reader's eye tracks the response. Motion communicates affordance without distraction.
Interactive elements show a visible focus ring when selected by keyboard navigation. The ring is accessible and consistent. Keyboard users navigate the dashboard with confidence. Focus is a first-class visual state.
Dashboard visuals have to carry the tenant's brand without breaking the system that keeps dashboards legible. Strkr's canvas accepts a brand accent, logo, and type pair at the tenant level. The structural design system (hierarchy, state palette, chart forms) stays shared so the product reads consistently. Brand and system coexist.
The tenant's brand accent applies to interactive affordances: buttons, selected filter chips, chart hover highlights. The accent complements the signal palette rather than replacing it. Brand feels present without overwhelming.
The tenant's logo renders in the dashboard header, email reports, and PDF covers. The dashboard reads as the organisation's own property. The logo appears where readers expect it, not scattered across every tile.
The tenant declares a type pair for headings and body. The dashboard uses it consistently. The reader experiences the organisation's typographic voice across the dashboard, the email, and the PDF.
The signal palette (green, amber, red for state) is never overridden by brand customization. Even if the organisation's brand accent is red, state signals use the system's red, not the brand's. The reader's signal vocabulary is protected.
Chart forms (scalar, trend, ranker, funnel, table) are not customizable per tenant. The library stays shared so dashboards built in different quarters, by different makers, read the same way. Consistency is a product-wide property.
The brand accent, logo, and type pair all render legibly in both light and dark themes. Tenants that use a bright accent get an adjusted shade in dark mode so contrast holds. Branding adapts without the maker touching style properties.
Dashboard visuals are not confined to the live surface. The visuals travel into emails, PDFs, slide decks, embeds, and public links. Strkr's rendering engine preserves the visual quality across every destination. The reader opening a PDF sees the same tight typography and honest colour as the reader on the live dashboard.
Dashboard tiles render in HTML emails with the type scale, the signal palette, and the brand accent preserved. The email client (Gmail, Outlook, Apple Mail) shows the dashboard as it would read in the browser. The reader's inbox is a legitimate surface.
PDFs render with real text layers, logical page breaks, and shared typography with the live dashboard. The reader prints to paper or distributes digitally. The visuals carry at projection resolution and at 300 dpi equivalent.
Charts export as high-resolution PNG for inclusion in slide decks. The exported image reads at projection resolution. The maker drops the image into a deck and the visuals read as polished as the live dashboard.
Charts export as SVG for inclusion in design artifacts, marketing collateral, or custom brand materials. The vectors scale infinitely without rasterization. Designers edit the exported file in their preferred tool while preserving the system's typography.
Embedded dashboard tiles render inside Notion, Confluence, SharePoint, and custom intranets with the visuals preserved. The embed inherits typography and spacing from the host page where it can, and falls back to the system defaults where it cannot.
Public links render dashboards with the tenant's branding and the system's typography. Scrubbed-data public variants carry the visual polish while masking sensitive numbers. The visuals travel without compromising security.
The craft layer: typography scale, iconography vocabulary, spacing and rhythm, polish states (loading, empty, error), tenant branding, and rendering fidelity across live dashboards, emails, PDFs, slides, embeds, and public links.
Four: display for anchor numbers, headline for section titles, body for chart labels and prose, small for metadata. The scale is shared across every dashboard so readers never retune.
Yes, within the system. Brand accent, logo, type pair, and favicon customize per tenant. The structural design system (hierarchy, signal palette, chart forms) stays shared so dashboards read consistently across tenants and across quarters.
Every tile renders in both light and dark themes. The brand accent adjusts for contrast in dark mode. The signal palette (green, amber, red) adjusts for dark backgrounds while preserving its vocabulary. Operators who read at night get the same signal as operators who read in daylight.
Yes. TV mode scales the type scale up for cross-room reading, defaults to dark theme, hides browser chrome, and rotates between dashboards on a configured cadence. The visuals adapt to the physical screen.
Yes. Body text and chart labels meet WCAG AA contrast in both themes. Chart series colours maintain separation for 95 percent of colourblind readers. Alt text and reading order preserve in exports. Strkr is HIPAA compliant with a BAA available, pursuing SOC 2 Type II with completion targeted through 2026-Q4, GDPR, and CCPA compliant.
No sales call, no migration consultant, no four-month implementation. Enter your card, get 14 days of the full Pro tier, cancel any time before day 14 with zero charge. Spin up a workspace, import your CSV, and have something useful before lunch.
