Scribd
Upload
13 views5 pages

Overview

Uploaded by

Navaneethan Navaneethan
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
13 views5 pages

Overview

Uploaded by

Navaneethan Navaneethan
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 5

<html>

<head>
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="" />
<link
rel="stylesheet"
as="style"
onload="this.rel='stylesheet'"
href="https://fonts.googleapis.com/css2?display=swap&amp;family=Noto+Sans
%3Awght%40400%3B500%3B700%3B900&amp;family=Work+Sans%3Awght
%40400%3B500%3B700%3B900"
/>

<title>Galileo Design</title>
<link rel="icon" type="image/x-icon" href="data:image/x-icon;base64," />

<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></
script>
</head>
<body>
<div class="relative flex size-full min-h-screen flex-col bg-white
group/design-root overflow-x-hidden" style='font-family: "Work Sans", "Noto Sans",
sans-serif;'>
<div class="layout-container flex h-full grow flex-col">
<header class="flex items-center justify-between whitespace-nowrap border-b
border-solid border-b-[#f0f2f5] px-10 py-3">
<div class="flex items-center gap-4 text-[#111418]">
<div class="size-4">
<svg viewBox="0 0 48 48" fill="none"
xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_6_535)">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M47.2426 24L24 47.2426L0.757355 24L24 0.757355L47.2426
24ZM12.2426 21H35.7574L24 9.24264L12.2426 21Z"
fill="currentColor"
></path>
</g>
<defs>
<clipPath id="clip0_6_535"><rect width="48" height="48"
fill="white"></rect></clipPath>
</defs>
</svg>
</div>
<h2 class="text-[#111418] text-lg font-bold leading-tight tracking-[-
0.015em]">Finwise</h2>
</div>
<div class="flex flex-1 justify-end gap-8">
<div class="flex items-center gap-9">
<a class="text-[#111418] text-sm font-medium leading-normal"
href="#">Dashboard</a>
<a class="text-[#111418] text-sm font-medium leading-normal"
href="#">Transactions</a>
<a class="text-[#111418] text-sm font-medium leading-normal"
href="#">Savings</a>
<a class="text-[#111418] text-sm font-medium leading-normal"
href="#">Credit</a>
<a class="text-[#111418] text-sm font-medium leading-normal"
href="#">Investing</a>
</div>
<div class="flex gap-2">
<button
class="flex max-w-[480px] cursor-pointer items-center justify-
center overflow-hidden rounded-xl h-10 bg-[#f0f2f5] text-[#111418] gap-2 text-sm
font-bold leading-normal tracking-[0.015em] min-w-0 px-2.5"
>
<div class="text-[#111418]" data-icon="Bell" data-size="20px" data-
weight="regular">
<svg xmlns="http://www.w3.org/2000/svg" width="20px"
height="20px" fill="currentColor" viewBox="0 0 256 256">
<path

d="M221.8,175.94C216.25,166.38,208,139.33,208,104a80,80,0,1,0-160,0c0,35.34-
8.26,62.38-
13.81,71.94A16,16,0,0,0,48,200H88.81a40,40,0,0,0,78.38,0H208a16,16,0,0,0,13.8-
24.06ZM128,216a24,24,0,0,1-22.62-16h45.24A24,24,0,0,1,128,216ZM48,184c7.7-13.24,16-
43.92,16-80a64,64,0,1,1,128,0c0,36.05,8.28,66.73,16,80Z"
></path>
</svg>
</div>
</button>
<button
class="flex max-w-[480px] cursor-pointer items-center justify-
center overflow-hidden rounded-xl h-10 bg-[#f0f2f5] text-[#111418] gap-2 text-sm
font-bold leading-normal tracking-[0.015em] min-w-0 px-2.5"
>
<div class="text-[#111418]" data-icon="Gear" data-size="20px" data-
weight="regular">
<svg xmlns="http://www.w3.org/2000/svg" width="20px"
height="20px" fill="currentColor" viewBox="0 0 256 256">
<path

d="M128,80a48,48,0,1,0,48,48A48.05,48.05,0,0,0,128,80Zm0,80a32,32,0,1,1,32-
32A32,32,0,0,1,128,160Zm88-29.84q.06-2.16,0-4.32l14.92-18.64a8,8,0,0,0,1.48-
7.06,107.21,107.21,0,0,0-10.88-26.25,8,8,0,0,0-6-3.93l-23.72-2.64q-1.48-1.56-3-
3L186,40.54a8,8,0,0,0-3.94-6,107.71,107.71,0,0,0-26.25-10.87,8,8,0,0,0-
7.06,1.49L130.16,40Q128,40,125.84,40L107.2,25.11a8,8,0,0,0-7.06-
1.48A107.6,107.6,0,0,0,73.89,34.51a8,8,0,0,0-3.93,6L67.32,64.27q-1.56,1.49-
3,3L40.54,70a8,8,0,0,0-6,3.94,107.71,107.71,0,0,0-
10.87,26.25,8,8,0,0,0,1.49,7.06L40,125.84Q40,128,40,130.16L25.11,148.8a8,8,0,0,0-
1.48,7.06,107.21,107.21,0,0,0,10.88,26.25,8,8,0,0,0,6,3.93l23.72,2.64q1.49,1.56,3,3
L70,215.46a8,8,0,0,0,3.94,6,107.71,107.71,0,0,0,26.25,10.87,8,8,0,0,0,7.06-
1.49L125.84,216q2.16.06,4.32,0l18.64,14.92a8,8,0,0,0,7.06,1.48,107.21,107.21,0,0,0,
26.25-10.88,8,8,0,0,0,3.93-6l2.64-23.72q1.56-1.48,3-3L215.46,186a8,8,0,0,0,6-
3.94,107.71,107.71,0,0,0,10.87-26.25,8,8,0,0,0-1.49-7.06Zm-16.1-
6.5a73.93,73.93,0,0,1,0,8.68,8,8,0,0,0,1.74,5.48l14.19,17.73a91.57,91.57,0,0,1-
6.23,15L187,173.11a8,8,0,0,0-5.1,2.64,74.11,74.11,0,0,1-6.14,6.14,8,8,0,0,0-
2.64,5.1l-2.51,22.58a91.32,91.32,0,0,1-15,6.23l-17.74-14.19a8,8,0,0,0-5-
1.75h-.48a73.93,73.93,0,0,1-8.68,0,8,8,0,0,0-
5.48,1.74L100.45,215.8a91.57,91.57,0,0,1-15-6.23L82.89,187a8,8,0,0,0-2.64-
5.1,74.11,74.11,0,0,1-6.14-6.14,8,8,0,0,0-5.1-2.64L46.43,170.6a91.32,91.32,0,0,1-
6.23-15l14.19-17.74a8,8,0,0,0,1.74-5.48,73.93,73.93,0,0,1,0-8.68,8,8,0,0,0-1.74-
5.48L40.2,100.45a91.57,91.57,0,0,1,6.23-15L69,82.89a8,8,0,0,0,5.1-
2.64,74.11,74.11,0,0,1,6.14-
6.14A8,8,0,0,0,82.89,69L85.4,46.43a91.32,91.32,0,0,1,15-
6.23l17.74,14.19a8,8,0,0,0,5.48,1.74,73.93,73.93,0,0,1,8.68,0,8,8,0,0,0,5.48-
1.74L155.55,40.2a91.57,91.57,0,0,1,15,6.23L173.11,69a8,8,0,0,0,2.64,5.1,74.11,74.11
,0,0,1,6.14,6.14,8,8,0,0,0,5.1,2.64l22.58,2.51a91.32,91.32,0,0,1,6.23,15l-
14.19,17.74A8,8,0,0,0,199.87,123.66Z"
></path>
</svg>
</div>
</button>
</div>
<div
class="bg-center bg-no-repeat aspect-square bg-cover rounded-full
size-10"
style='background-image:
url("https://cdn.usegalileo.ai/stability/dfc0806b-2119-4acc-b4eb-
074be1caac8e.png");'
></div>
</div>
</header>
<div class="px-40 flex flex-1 justify-center py-5">
<div class="layout-content-container flex flex-col max-w-[960px] flex-1">
<h2 class="text-[#111418] tracking-light text-[28px] font-bold leading-
tight px-4 text-left pb-3 pt-5">Overview</h2>
<div class="flex flex-wrap gap-3 px-4 py-3">
<div class="flex min-w-[111px] flex-1 basis-[fit-content] flex-col
gap-2 rounded-lg border border-[#dbe0e6] p-3 items-start">
<p class="text-[#111418] tracking-light text-2xl font-bold leading-
tight">$12,000</p>
<div class="flex items-center gap-2"><p class="text-[#60758a] text-
sm font-normal leading-normal">Total income</p></div>
</div>
<div class="flex min-w-[111px] flex-1 basis-[fit-content] flex-col
gap-2 rounded-lg border border-[#dbe0e6] p-3 items-start">
<p class="text-[#111418] tracking-light text-2xl font-bold leading-
tight">$7,000</p>
<div class="flex items-center gap-2"><p class="text-[#60758a] text-
sm font-normal leading-normal">Total expenses</p></div>
</div>
<div class="flex min-w-[111px] flex-1 basis-[fit-content] flex-col
gap-2 rounded-lg border border-[#dbe0e6] p-3 items-start">
<p class="text-[#111418] tracking-light text-2xl font-bold leading-
tight">$5,000</p>
<div class="flex items-center gap-2"><p class="text-[#60758a] text-
sm font-normal leading-normal">Savings goals</p></div>
</div>
<div class="flex min-w-[111px] flex-1 basis-[fit-content] flex-col
gap-2 rounded-lg border border-[#dbe0e6] p-3 items-start">
<p class="text-[#111418] tracking-light text-2xl font-bold leading-
tight">$3,000</p>
<div class="flex items-center gap-2"><p class="text-[#60758a] text-
sm font-normal leading-normal">Total net worth</p></div>
</div>
<div class="flex min-w-[111px] flex-1 basis-[fit-content] flex-col
gap-2 rounded-lg border border-[#dbe0e6] p-3 items-start">
<p class="text-[#111418] tracking-light text-2xl font-bold leading-
tight">$2,000</p>
<div class="flex items-center gap-2"><p class="text-[#60758a] text-
sm font-normal leading-normal">Cash balance</p></div>
</div>
</div>
<div class="flex flex-col gap-3 p-4">
<div class="flex gap-6 justify-between">
<p class="text-[#111418] text-base font-medium leading-
normal">Progress on savings goal: Vacation</p>
<p class="text-[#111418] text-sm font-normal leading-
normal">2,500</p>
</div>
<div class="rounded bg-[#dbe0e6]"><div class="h-2 rounded bg-
[#111418]" style="width: 50%;"></div></div>
</div>
<div class="flex px-4 py-3 justify-end">
<button
class="flex min-w-[84px] max-w-[480px] cursor-pointer items-center
justify-center overflow-hidden rounded-xl h-10 px-4 bg-transparent text-[#111418]
text-sm font-bold leading-normal tracking-[0.015em]"
>
<span class="truncate">Add a new goal</span>
</button>
</div>
</div>
<div class="layout-content-container flex flex-col">
<div class="flex h-full min-h-[700px] flex-col justify-between bg-white
p-4">
<div class="flex flex-col gap-4">
<div class="flex flex-col gap-2">
<div class="flex items-center gap-3 px-3 py-2 rounded-xl bg-
[#f0f2f5]"><p class="text-[#111418] text-sm font-medium
leading-normal">Overview</p></div>
<div class="flex items-center gap-3 px-3 py-2"><p class="text-
[#111418] text-sm font-medium leading-normal">Income</p></div>
<div class="flex items-center gap-3 px-3 py-2"><p class="text-
[#111418] text-sm font-medium leading-normal">Expense</p></div>
<div class="flex items-center gap-3 px-3 py-2"><p class="text-
[#111418] text-sm font-medium leading-normal">Savings</p></div>
<div class="flex items-center gap-3 px-3 py-2"><p class="text-
[#111418] text-sm font-medium leading-normal">Net Worth</p></div>
</div>
</div>
</div>
</div>
</div>
<footer class="flex justify-center">
<div class="flex max-w-[960px] flex-1 flex-col">
<footer class="flex flex-col gap-6 px-5 py-10 text-center @container">
<div class="flex flex-wrap items-center justify-center gap-6
@[480px]:flex-row @[480px]:justify-around">
<a class="text-[#60758a] text-base font-normal leading-normal min-
w-40" href="#">About</a>
<a class="text-[#60758a] text-base font-normal leading-normal min-
w-40" href="#">Help</a>
<a class="text-[#60758a] text-base font-normal leading-normal min-
w-40" href="#">Legal</a>
</div>
<div class="flex flex-wrap justify-center gap-4">
<a href="#">
<div class="text-[#60758a]" data-icon="FacebookLogo" data-
size="24px" data-weight="regular">
<svg xmlns="http://www.w3.org/2000/svg" width="24px"
height="24px" fill="currentColor" viewBox="0 0 256 256">
<path

d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm8,191.63V152h24a8,8,0,
0,0,0-16H136V112a16,16,0,0,1,16-16h16a8,8,0,0,0,0-16H152a32,32,0,0,0-
32,32v24H96a8,8,0,0,0,0,16h24v63.63a88,88,0,1,1,16,0Z"
></path>
</svg>
</div>
</a>
<a href="#">
<div class="text-[#60758a]" data-icon="TwitterLogo" data-
size="24px" data-weight="regular">
<svg xmlns="http://www.w3.org/2000/svg" width="24px"
height="24px" fill="currentColor" viewBox="0 0 256 256">
<path

d="M247.39,68.94A8,8,0,0,0,240,64H209.57A48.66,48.66,0,0,0,168.1,40a46.91,46.91,0,0
,0-
33.75,13.7A47.9,47.9,0,0,0,120,88v6.09C79.74,83.47,46.81,50.72,46.46,50.37a8,8,0,0,
0-13.65,4.92c-4.31,47.79,9.57,79.77,22,98.18a110.93,110.93,0,0,0,21.88,24.2c-
15.23,17.53-39.21,26.74-39.47,26.84a8,8,0,0,0-
3.85,11.93c.75,1.12,3.75,5.05,11.08,8.72C53.51,229.7,65.48,232,80,232c70.67,0,129.7
2-54.42,135.75-124.44l29.91-29.9A8,8,0,0,0,247.39,68.94Zm-45,29.41a8,8,0,0,0-
2.32,5.14C196,166.58,143.28,216,80,216c-10.56,0-18-1.4-23.22-3.08,11.51-6.25,27.56-
17,37.88-32.48A8,8,0,0,0,92,169.08c-.47-.27-43.91-26.34-44-
96,16,13,45.25,33.17,78.67,38.79A8,8,0,0,0,136,104V88a32,32,0,0,1,9.6-
22.92A30.94,30.94,0,0,1,167.9,56c12.66.16,24.49,7.88,29.44,19.21A8,8,0,0,0,204.67,8
0h16Z"
></path>
</svg>
</div>
</a>
<a href="#">
<div class="text-[#60758a]" data-icon="InstagramLogo" data-
size="24px" data-weight="regular">
<svg xmlns="http://www.w3.org/2000/svg" width="24px"
height="24px" fill="currentColor" viewBox="0 0 256 256">
<path

d="M128,80a48,48,0,1,0,48,48A48.05,48.05,0,0,0,128,80Zm0,80a32,32,0,1,1,32-
32A32,32,0,0,1,128,160ZM176,24H80A56.06,56.06,0,0,0,24,80v96a56.06,56.06,0,0,0,56,5
6h96a56.06,56.06,0,0,0,56-56V80A56.06,56.06,0,0,0,176,24Zm40,152a40,40,0,0,1-
40,40H80a40,40,0,0,1-40-
40V80A40,40,0,0,1,80,40h96a40,40,0,0,1,40,40ZM192,76a12,12,0,1,1-12-
12A12,12,0,0,1,192,76Z"
></path>
</svg>
</div>
</a>
</div>
<p class="text-[#60758a] text-base font-normal leading-normal">@2022
Finwise</p>
</footer>
</div>
</footer>
</div>
</div>
</body>
</html>

You might also like