Crypto Portfolio Dashboard with Range-Based Charts and Profit/LossCrypto Portfolio Dashboard with Range-Based Charts and Profit/Loss
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Crypto Portfolio Dashboard
Blue means one thing here: the range you are looking at.
The value chart is a row of thin gray bars, and only the selected date range fills in blue. You read the period that matters and keep the months around it as context.
The phone carries the same chart above the holdings list. Each coin gets its own small bar chart between the name and the amount, so you can scan the whole portfolio for movement without opening a single coin.
Trading screens get busy fast. This one stays light and calm, so the numbers lead: total value, realized and unrealized P&L and open positions, all on one screen.
Designed by the Hue & Machine team.
#Crypto #Fintech #DashboardDesign #TradingPlatform #DataVisualization #UIDesign #ProductDesign #WebApp #MobileDesign #FigmaDesign
Post image
Shakil's avatar
Good design
Dmytro's avatar
Thanks, Shakil!
Sujon's avatar
Good design
Dmytro's avatar
Thanks, Sujon!
Jalal's avatar
Clear work Dmytro🔥
Dmytro's avatar
Thanks, Jalal!
Devowise's avatar
Really clean dashboard design! Love how the selective use of blue keeps the data easy to scan without overwhelming the interface.
Dmytro's avatar
Thanks a lot! That was the whole idea: blue only ever marks the range you picked, and everything else stays quiet, so you see your selection before anything else. Glad it came through.
Ezzat's avatar
Smart work, Dmytro.
Dmytro's avatar
Thank you, Ezzat!
DESH's avatar
You nailed it! ❤️
Dmytro's avatar
Thanks! 🙌
Anyadi's avatar
Nice Ui Dmytro
Dmytro's avatar
Thanks, Anyadi!
Anyadi's avatar
You're welcome
Skye's avatar
Love this!
Dmytro's avatar
Thank you guys!
REELE's avatar
The generous spacing around the numbers gives this a surprisingly calm feel for a trading screen.
Dmytro's avatar
Thank you! Yeah, calm was exactly what we were going for. People spend hours on a trading screen, so we gave the numbers room to breathe and kept color to the one thing that changes. Which is the range you’re looking at.
Rishabh's avatar
great design
Dmytro's avatar
Thanks Rishabh!
Dmytro's avatar
Thanks Paramjeet!
Tabish's avatar
Using blue only for the selected range is such a smart call. You keep the context without it fighting for attention. Clean work Dmytro.
Dmytro's avatar
Thanks! That was the balance I was after as the gray bars keep the whole timeline in view and blue only shows up where your attention should be. Glad it reads that way 🙌
Madob 's avatar
Stunning!
Dmytro's avatar
Thanks Madob!
Rafee 's avatar
only for the selected range is a smart call. Does the gray stay readable in dark mode?
Dmytro's avatar
Great question! Designed this one light-only, so I haven’t tested that gray on a dark background yet. For a dark version, the gray would need to get lighter and the blue a bit brighter, so the selected range still stands out from the rest of the chart.
Mostafa's avatar
Great app design
Zara's avatar
Looking clean and calm.
Picto's avatar
Picto Design Studio logo
Amazing work👏🔥🔥
Cipher's avatar
Love the first frame Dmytro
Nexux's avatar
very clean wrok
Vineet's avatar
Using blue only for the selected range is a clean way to keep the context without the noise. The thin gray bars make the period you care about jump out immediately.
amanulla's avatar
nice ui
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started