5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T737,

Premium Investment ROI Visualizer

Transform static financial data into an interactive visual experience.

Vraxis Yield is a premium ROI visualization component designed for modern landing pages, financial dashboards, SaaS platforms, and business websites. The component allows users to explore investment scenarios through responsive sliders, dynamic calculations, and live visual feedback.

Every control updates instantly, creating a smooth and engaging user experience while maintaining a clean, professional presentation.

Features

Interactive ROI Calculations

Adjust investment variables and instantly view updated projections, capital allocation totals, and growth estimates.

Dynamic Ratio Visualization

A responsive visual ratio bar displays the relationship between invested capital and projected growth, helping users understand outcomes at a glance.

Responsive Interface

Built to adapt seamlessly across desktop, tablet, and mobile layouts.

Theme Adaptive Design

Automatically inherits your Framer project's color variables, typography settings, borders, and styling preferences.

Accessible Controls

Includes keyboard-friendly sliders and accessibility-conscious interaction patterns.

Optimized Performance

Designed with lightweight interactions and efficient update logic to maintain a smooth user experience.

Recommended Layout Settings

For the best results:

Width

Set the component width to Fill or 100%

Height

Set the component height to Fit Content

These settings ensure the component scales correctly across different breakpoints and layout structures.

5a:[["$","$L5d",null,{"post":{"id":"019e98a0-e2c4-7d69-bf85-037330bc5e23","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"295e8fd3-ed6e-4502-b6c3-469d7c506141","name":"Joel Kazadi","slug":"joel-kazadi","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2378276/avatar-umPGRax7mBL1cjP1SxVItBqsPgbyiE.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"NAqqeQ94YyvNBxiD0z2e","resolved":true,"title":"Investment ROI Card","body":"$5e","bodyJson":null,"introduction":"Premium interactive yield engine","slug":"investment-roi-card","author":{"framerUserId":"295e8fd3-ed6e-4502-b6c3-469d7c506141","name":"Joel Kazadi","slug":"joel-kazadi","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/2378276/avatar-umPGRax7mBL1cjP1SxVItBqsPgbyiE.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/NAqqeQ94YyvNBxiD0z2e/investment-roi-card-sQhS8CrjKDjTXTVPNj0hXj5xaRNRlY","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-30T15:18:21.698Z","updatedAt":"2026-06-16T07:52:37.105Z","publishedAt":"2026-06-05T16:32:21.188Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://re.chujiqiqi.com/m/Roi-uiNN7v.js@Wjr2K127CNwkGsRkn6vC","previewUrl":"https://indigo-jaguar-604796.framer.app/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"c3e183d1-597a-4479-8a6f-244ae3c96f40","name":"Cards","slug":"cards"}],"lastSaveId":"Wjr2K127CNwkGsRkn6vC","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":7,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-05T16:32:21.188Z","updatedAt":"2026-06-05T16:32:21.188Z","reported":false}}],"$L5f"]

Suggested for you