Namefi brand kit
Namefi owns the green.
Official Namefi logos, marks, colors, and usage guidance for social media, reports, partnership materials, and approved brand placements.
Icon & Favicon
The compact "Nfi" mark, cut from the first Lottie frame, for favicons, app icons, and avatars. Pick a format and a pixel size, then download. SVG is resolution-independent; the square variants center the mark in a 1:1 frame (the most common icon slot), and the tight cut has no padding. Transparent and on-black versions are provided.
Full Mark — Square & Round
The full "Namefi" lockup (as opposed to the compact "Nfi" icon above), on square and round backgrounds. Transparent safe-area crops for compositing over your own background, and opaque colored card badges for direct use as an avatar or app icon.
Motion Mark
The app uses `ExpandingLottieMark`: an 80x24 Lottie canvas rendered at 66x19.8, clipped to 28px in collapsed rail state, then expanded over 1001ms with the sampled Lottie easing.
Animated mark
Use the Lottie file when the mark should expand from compact to wordmark.
Compact first frame
Use this as the compact mark in rails, round avatars, app chips, and tight navigation, not the NFSC mark.
Expanded last frame
The final frame resolves to the full Namefi wordmark. Keep the Lottie pinned left and clip the wrapper width.
Color Palette
The current Astra theme maps primary, secondary, and tertiary brand slots to the same green. The kit keeps that precision and pairs it with neutral UI tokens from the shared stylesheet.
Namefi Green#1CD17Doklch(75.85% 0.1804 155.5)
Backgroundoklch(0.145 0 0)App root
Surfaceoklch(0.205 0 0)Cards and panels
Secondaryoklch(0.269 0 0)Raised controls
Foregroundoklch(0.985 0 0)Primary text
Mutedoklch(0.708 0 0)Secondary text
Logo Rules
Use these rules to keep Namefi consistent, recognizable, and clear across every placement.
Use green first
The primary logotype should use #1CD17D on dark or light neutral fields when contrast holds.
Reserve mono
Use the white mono mark on dark photography, dense UI chrome, or partner lockups where green competes.
Keep clearspace
Use at least the height of the N counter block around the logotype. Do not crowd edges or badges.
Protect color intent
Avoid gradients, outlines, shadows, or arbitrary alternate hues for the main logotype. Use mono treatments only when the placement needs a single-color mark.
Spell Namefi
Use Namefi in running text. Do not write NameFi or NameFI. Use NAMEFI only where full capitalization is required.
Type Direction
Use typography that supports a clear, credible financial brand voice across public materials and product-adjacent communications.
Domains become financial rails.
Namefi can use a high-contrast serif for brand-led moments, paired with a pragmatic sans for product interfaces, tables, and purchase flows.
Display
Use restrained serif display type for brand kit pages, campaign headlines, and investor-facing material.
Product
Keep product UI and support materials in a clean sans-serif style that stays legible at small sizes.
Usage Examples
Quick visual tests for the mark across dark product chrome, light editorial backgrounds, and green-forward campaign surfaces.
Product chrome
Use the primary green against near-black app surfaces for maximum recognition.
Editorial light
Green mark remains legible on warm off-white when surrounded by enough quiet space.
Green surface
Switch to ink or mono treatment when the surface itself carries the brand color.
Actual Size Ladder
These frames use real SVG files. The compact mark is exported from frame 0 of the Lottie asset; the wordmarks use the source logotype SVG or the Lottie final-frame SVG.
Favicon / 16px
16 x 16 frame / 1px padding
Favicon / 32px
32 x 32 frame / 2px padding
Square app icon / 64px
64 x 64 frame / 4px padding
Round avatar / 96px
96px circle / 10px radial padding
Small nav wordmark
120 x 40 frame / source logotype
Large wordmark
280 x 96 frame / source logotype
Mono on green
160 x 56 frame / mono source SVG
Icon Padding Matrix
All six cards below are 64 x 64 frames using the actual compact SVG. The square examples maximize against the inner rectangle; the round examples fit the compact mark inside the circle with radial padding.
Square max
2px padding
Square tight
8px padding
Square roomy
16px padding
Round max
4px radial padding
Round balanced
10px radial padding
Round roomy
18px radial padding
