Header & Design Settings

Your PathPro project portal is the public face of your product. With header and design settings, you can customize navigation tabs, upload your logo, inject custom CSS, and fine-tune the visual identity so your portal feels like a natural extension of your brand.

PathPro projects come with several built-in navigation tabs: Roadmap, Features, Release Notes, Submissions, and more. From the Header & Design settings page, you can control which tabs appear, what they're called, and the order in which they display.

To rename a tab, click on the tab label field and type your preferred name. For example, you might rename "Features" to "Ideas" or "Roadmap" to "Product Plan" to better match the language your community already uses. Tab labels support standard text characters and are limited to a reasonable length to keep your navigation clean.

You can also toggle individual tabs on or off. If your project doesn't use support tickets, simply disable the Support tab and it won't appear in your navigation at all. This keeps the experience focused and avoids confusing your community with empty pages.

Tab ordering is controlled by dragging tabs into your preferred sequence. The first tab in the list becomes the default landing page when someone visits your project URL. Consider putting your most active section first — if your community is primarily voting on features, make the Features tab the first thing they see.

Your project logo appears in the header bar alongside your project name. It's one of the first things visitors notice, so it's worth getting right.

To upload a logo, navigate to Settings → Header & Design and click the logo upload area. PathPro accepts PNG, JPG, and SVG formats. For best results, use a square or horizontally-oriented image with a transparent background. The recommended dimensions are 200 x 60 pixels or larger at the same aspect ratio — PathPro will scale it down to fit the header without distortion.

Your logo appears in several places: the project header on every page, the login and registration screens for your project, and in email notifications sent to community members. Make sure it looks good at small sizes, since the header renders it at roughly 40 pixels tall.

If you don't upload a logo, PathPro displays your project name in text. You can remove a previously uploaded logo at any time to revert to the text-only display.

Sometimes your community needs quick access to resources outside PathPro — your marketing site, documentation, a changelog blog, or a community forum. Custom menu links let you add external URLs directly into your project's navigation bar.

Each custom link has a label (the text displayed in the nav bar) and a URL (where it points). Links open in a new tab by default so visitors don't lose their place in your project. You can add multiple custom links, though keeping it to two or three is recommended to avoid cluttering the navigation.

Custom links appear after your standard PathPro tabs. They're styled consistently with the rest of the navigation, so they feel like native parts of your portal rather than bolted-on additions.

Custom CSS

For teams that need pixel-perfect brand alignment, PathPro offers a custom CSS injection field. Any CSS you enter here is loaded on every public-facing page of your project, giving you full control over the visual appearance.

Common use cases include changing font families to match your brand typography, adjusting spacing or border radius on cards, hiding specific UI elements, or adding custom hover effects. The CSS is injected after PathPro's default styles, so your rules take precedence.

A few practical tips: use your browser's developer tools to inspect elements and find the right selectors before writing your CSS. PathPro uses BEM-style class names, so selectors are predictable and stable across updates. Test your changes on both desktop and mobile views, since the layout is responsive. And always keep a backup of your CSS in a separate file — the text field in settings doesn't have version history.

Note that custom CSS is available on Pro plans and above. The CSS is sanitized for security, so JavaScript injection via CSS expressions is not permitted.

Submit Feedback Button

The "Submit Feedback" button is one of the most important interactive elements on your project. It's the primary call-to-action for community members who want to share ideas, report bugs, or request features.

You can customize the button's text label to better fit your context. Instead of "Submit Feedback," you might use "Share an Idea," "Report a Bug," or "Request a Feature." The label should clearly communicate what happens when someone clicks it — ambiguity reduces engagement.

The button inherits your project's accent color by default, making it visually prominent in the header. If you've set a custom accent color, the button will automatically use it for its background, ensuring visual consistency across your portal.

Accent Color

Every PathPro project has a configurable accent color that cascades throughout the interface. This color is used for buttons, active tab indicators, links, vote count highlights, and other interactive elements.

To set your accent color, use the color picker in the Header & Design settings page. You can also enter a hex code directly if you have specific brand colors to match. PathPro automatically generates appropriate hover and active states from your chosen color, so you don't need to specify variants.

When choosing an accent color, consider contrast and accessibility. Bright, saturated colors work well against the white and light gray backgrounds used in the default theme. Very light colors (pastels) may not provide enough contrast for text and icons. PathPro will warn you if your chosen color might cause readability issues.

The accent color applies across every public-facing page in your project. It does not affect the admin dashboard or settings pages, which maintain PathPro's standard styling for consistency.

Use Case Shout-Out
Match your PathPro portal to your brand — upload your logo, set your accent color, and customize tab labels so it feels native to your product.