diff --git a/src/assets/baicizhan.png b/src/assets/baicizhan.png
new file mode 100644
index 0000000..44cdcfd
Binary files /dev/null and b/src/assets/baicizhan.png differ
diff --git a/src/assets/greasyFork.png b/src/assets/greasyFork.png
new file mode 100644
index 0000000..6b73ced
Binary files /dev/null and b/src/assets/greasyFork.png differ
diff --git a/src/assets/kazoottt-avatar.jpeg b/src/assets/kazoottt-avatar.jpeg
new file mode 100644
index 0000000..404a693
Binary files /dev/null and b/src/assets/kazoottt-avatar.jpeg differ
diff --git a/src/assets/scu.png b/src/assets/scu.png
new file mode 100644
index 0000000..c7c7c87
Binary files /dev/null and b/src/assets/scu.png differ
diff --git a/src/assets/wind.png b/src/assets/wind.png
new file mode 100644
index 0000000..170a454
Binary files /dev/null and b/src/assets/wind.png differ
diff --git a/src/components/ProjectCard.astro b/src/components/ProjectCard.astro
index c252fee..6c26e30 100644
--- a/src/components/ProjectCard.astro
+++ b/src/components/ProjectCard.astro
@@ -10,7 +10,8 @@ const {
 	heading,
 	subheading,
 	imagePath,
-	altText
+	altText,
+	target
 } = Astro.props
 const images = import.meta.glob<{ default: ImageMetadata }>('/src/assets/*.{jpeg,jpg,png,gif}')
 if (!images[imagePath])
@@ -24,6 +25,7 @@ if (!images[imagePath])
 		href && 'transition-all hover:border-foreground/25 hover:shadow-sm'
 	)}
 	href={href}
+	target={target}
 >
 	<Image
 		src={images[imagePath]()}
diff --git a/src/components/Section.astro b/src/components/Section.astro
index 0a0deac..c0a24bc 100644
--- a/src/components/Section.astro
+++ b/src/components/Section.astro
@@ -1,12 +1,13 @@
 ---
 import { cn } from '@/utils'
 
-const { class: className, title } = Astro.props
+const { class: className, title, subtitle } = Astro.props
 ---
 
 <section class={cn(className, 'flex flex-col gap-y-5 md:flex-row md:gap-y-0')}>
-	<div class='text-xl font-semibold md:w-1/3'>
-		<h2>{title}</h2>
+	<div class='md:w-1/3'>
+		<h2 class='font-semibol text-xl'>{title}</h2>
+		<h3 class='text-muted-foreground'>{subtitle}</h3>
 	</div>
 	<div class='flex flex-col gap-y-3 md:w-2/3'>
 		<slot />
diff --git a/src/components/layout/Footer.astro b/src/components/layout/Footer.astro
index c00e5d7..b5cb823 100644
--- a/src/components/layout/Footer.astro
+++ b/src/components/layout/Footer.astro
@@ -1,5 +1,5 @@
 ---
-
+import { Icon } from 'astro-icon/components'
 ---
 
 <footer class='mx-auto mt-24 w-full'>
@@ -17,7 +17,7 @@
           class='inline-flex gap-x-2 text-gray-600 hover:text-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600'
           href='/privacy'>Privacy</a
         > -->
-				<p class=''>© 2024 lorem. All rights reserved.</p>
+				<p class=''>© 2024 kazoottt. All rights reserved.</p>
 			</div>
 
 			<div class='flex items-center justify-between'>
@@ -26,19 +26,15 @@
 					<!-- Linkedin -->
 					<a
 						class='inline-block text-muted-foreground transition-all hover:text-muted-foreground/75'
-						href='https://www.linkedin.com/in/example/'
+						href='https://github.com/kazoottt'
 					>
-						<svg
-							class='h-4 w-4 flex-shrink-0'
-							xmlns='http://www.w3.org/2000/svg'
-							width='1em'
-							height='1em'
-							viewBox='0 0 16 16'
-							><path
-								fill='currentColor'
-								d='M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248c-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586c.173-.431.568-.878 1.232-.878c.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252c-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z'
-							></path></svg
-						>
+						<Icon name='github' />
+					</a>
+					<a
+						class='inline-block text-muted-foreground transition-all hover:text-muted-foreground/75'
+						href='https://x.com/kazoottt'
+					>
+						<Icon name='twitter' />
 					</a>
 				</div>
 				<!-- End Social Brands -->
diff --git a/src/icons/github.svg b/src/icons/github.svg
new file mode 100644
index 0000000..2210301
--- /dev/null
+++ b/src/icons/github.svg
@@ -0,0 +1 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33s1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2"/></svg>
\ No newline at end of file
diff --git a/src/icons/link.svg b/src/icons/link.svg
new file mode 100644
index 0000000..5210d86
--- /dev/null
+++ b/src/icons/link.svg
@@ -0,0 +1 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7a5 5 0 0 0-5 5a5 5 0 0 0 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1M8 13h8v-2H8zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4a5 5 0 0 0 5-5a5 5 0 0 0-5-5"/></svg>
\ No newline at end of file
diff --git a/src/icons/twitter.svg b/src/icons/twitter.svg
new file mode 100644
index 0000000..04e58cf
--- /dev/null
+++ b/src/icons/twitter.svg
@@ -0,0 +1 @@
+<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M22.46 6c-.77.35-1.6.58-2.46.69c.88-.53 1.56-1.37 1.88-2.38c-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29c0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15c0 1.49.75 2.81 1.91 3.56c-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.2 4.2 0 0 1-1.93.07a4.28 4.28 0 0 0 4 2.98a8.52 8.52 0 0 1-5.33 1.84q-.51 0-1.02-.06C3.44 20.29 5.7 21 8.12 21C16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56c.84-.6 1.56-1.36 2.14-2.23"/></svg>
\ No newline at end of file
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 3e38e60..45af4e2 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -8,14 +8,15 @@ import SkillLayout from '../components/SkillLayout.astro'
 import PostPreview from '@/components/blog/PostPreview.astro'
 
 import { Image } from 'astro:assets'
-import astro from '../assets/about-astro.png'
+import kazootttAvatar from '../assets/kazoottt-avatar.jpeg'
 
 import { getAllPosts, sortMDByDate } from '@/utils'
+import { Icon } from 'astro-icon/components'
 
-const languages = ['lorem', 'ipsum']
-const frontend = ['lorem', 'ipsum', 'lorem', 'ipsum', 'lorem', 'ipsum', 'lorem']
-const backend = ['lorem', 'ipsum', 'lorem', 'ipsum']
-const others = ['lorem', 'ipsum', 'lorem', 'ipsum', 'lorem']
+const frontend = ['react(熟悉)', 'vue2(了解)', 'next.js', 'tailwindcss']
+const backend = ['nodejs(熟悉)', 'python(了解)', 'elysiajs', 'nextjs', 'cloudflare d1', 'prisma']
+const others = ['大模型提示词调优']
+const languages = ['英文']
 
 const MAX_POSTS = 10
 const allPosts = await getAllPosts()
@@ -26,47 +27,23 @@ const allPostsByDate = sortMDByDate(allPosts).slice(0, MAX_POSTS)
 	<div class='flex w-full flex-col gap-y-10'>
 		<section class='flex flex-col items-center gap-y-7'>
 			<Image
-				src={astro}
+				src={kazootttAvatar}
 				alt='profile photo'
-				class='h-28 w-auto rounded-full bg-[#FFBE98] p-2'
+				class='h-28 w-auto rounded-full bg-[#FFBE98] p-1'
 				loading='eager'
 			/>
 
 			<div class='flex flex-col items-center gap-y-4'>
-				<h1 class='text-3xl font-bold'>Lorem ipsum dolor</h1>
-				<div class='flex flex-wrap justify-center gap-x-7 gap-y-3'>
-					<Label title='Lorem Ipsum'>
-						<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='h-5 w-5' slot='icon'
-							><path
-								fill='currentColor'
-								d='M4.615 20q-.69 0-1.152-.462Q3 19.075 3 18.385v-9.77q0-.69.463-1.152Q3.925 7 4.615 7H9V5.615q0-.69.463-1.152Q9.925 4 10.615 4h2.77q.69 0 1.153.463q.462.462.462 1.152V7h4.385q.69 0 1.152.463q.463.462.463 1.152v9.77q0 .69-.462 1.152q-.463.463-1.153.463zm0-1h14.77q.23 0 .423-.192q.192-.193.192-.423v-9.77q0-.23-.192-.423Q19.615 8 19.385 8H4.615q-.23 0-.423.192Q4 8.385 4 8.615v9.77q0 .23.192.423q.193.192.423.192M10 7h4V5.615q0-.23-.192-.423Q13.615 5 13.385 5h-2.77q-.23 0-.423.192q-.192.193-.192.423zM4 19V8z'
-							></path></svg
-						>
+				<h1 class='text-3xl font-bold'>KazooTTT</h1>
+				<div class='flex flex-wrap justify-center gap-x-4 gap-y-3'>
+					<Label title='github' as='a' href='https://github.com/KazooTTT' target='_blank'>
+						<Icon name='github' slot='icon' />
 					</Label>
-					<Label title='Ipsum'>
-						<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='h-5 w-5' slot='icon'
-							><path
-								fill='currentColor'
-								d='M12.003 11.73q.668 0 1.14-.475q.472-.475.472-1.143t-.475-1.14q-.476-.472-1.143-.472t-1.14.476q-.472.475-.472 1.143t.475 1.14q.476.472 1.143.472M12 19.677q2.82-2.454 4.458-4.991q1.638-2.538 1.638-4.39q0-2.744-1.737-4.53T12 3.981q-2.621 0-4.359 1.785t-1.737 4.53q0 1.852 1.638 4.39q1.639 2.537 4.458 4.99m0 1.343q-3.525-3.117-5.31-5.814q-1.786-2.697-1.786-4.909q0-3.173 2.066-5.234Q9.037 3 12 3t5.03 2.062q2.066 2.061 2.066 5.234q0 2.212-1.785 4.909q-1.786 2.697-5.311 5.814m0-10.904'
-							></path></svg
-						>
+					<Label title='twitter' as='a' href='https://x.com/KazooTTT' target='_blank'>
+						<Icon name='twitter' slot='icon' />
 					</Label>
-					<Label
-						title='Connect on Linkedin'
-						as='a'
-						href='https://www.linkedin.com/in/example/'
-						target='_blank'
-					>
-						<svg
-							xmlns='http://www.w3.org/2000/svg'
-							viewBox='0 0 16 16'
-							slot='icon'
-							class='h-5 w-5 text-foreground/75'
-							><path
-								fill='currentColor'
-								d='M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248c-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586c.173-.431.568-.878 1.232-.878c.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252c-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z'
-							></path></svg
-						>
+					<Label title='汇总' as='a' href='https://bento.me/KazooTTT' target='_blank'>
+						<Icon name='link' slot='icon' />
 					</Label>
 				</div>
 			</div>
@@ -74,10 +51,7 @@ const allPostsByDate = sortMDByDate(allPosts).slice(0, MAX_POSTS)
 
 		<Section title='About'>
 			<p class='text-muted-foreground'>
-				Lorem ipsum dolor sit amet consectetur adipisicing elit. Reiciendis atque quia omnis
-				consectetur, voluptas praesentium veniam blanditiis ratione asperiores accusantium laborum
-				odit commodi quis deserunt incidunt et dolor iure ut! Lorem ipsum dolor sit, amet
-				consectetur adipisicing elit. Alias quia, doloribus ut beatae perspiciatis voluptatibus.
+				前端开发，技术栈主要为React全家桶, 不过也接触过Vue，偶尔使用 python 或者 nodejs 写后端。
 			</p>
 		</Section>
 		{
@@ -96,109 +70,63 @@ const allPostsByDate = sortMDByDate(allPosts).slice(0, MAX_POSTS)
 
 		<Section title='Experience'>
 			<Card
-				heading='Lorem Ipsum'
-				subheading='Sit amet consectetur'
-				date='Dec 2022 - Nov 2023'
-				imagePath='/src/assets/about-astro.png'
-				altText='Lorem, ipsum dolor sit'
+				heading='wind信息技术有限公司'
+				subheading='web前端开发'
+				date='2021年07月-2024年8月'
+				imagePath='/src/assets/wind.png'
+				altText='wind信息技术有限公司'
 				imageClass='h-12 w-auto md:-left-16'
 			>
 				<ul class='ml-4 list-disc text-muted-foreground'>
-					<li>
-						Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolore debitis recusandae, ut
-						molestiae laboriosam pariatur!
-
-						<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae, pariatur!</li>
-					</li>
+					<li>完成商城前台与后台开发</li>
+					<li>完成数据管理中台前端开发</li>
+					<li>完成大模型应用前、后端开发，提示词调优</li>
 				</ul>
 			</Card>
 			<Card
-				heading='Lorem Ipsum'
-				subheading='Sit amet consectetur'
-				date='Dec 2022 - Nov 2023'
-				imagePath='/src/assets/about-astro.png'
-				altText='Lorem, ipsum dolor sit'
+				heading='百词斩'
+				subheading='web前端开发（实习）'
+				date='2020年10月-2021年01月'
+				imagePath='/src/assets/baicizhan.png'
+				altText='百词斩'
 				imageClass='h-12 w-auto md:-left-16'
-			/>
+			>
+				<ul class='ml-4 list-disc text-muted-foreground'>
+					<li>百词斩电商前端开发</li>
+				</ul>
+			</Card>
 		</Section>
 
 		<Section title='Education'>
 			<Card
-				heading='Lorem Ipsum'
-				subheading='Sit amet consectetur'
-				date='Dec 2022 - Nov 2023'
-				imagePath='/src/assets/about-astro.png'
-				altText='Lorem, ipsum dolor sit'
+				heading='四川大学'
+				subheading='软件学院本科'
+				date='2017年9月-2021年7月'
+				imagePath='/src/assets/scu.png'
+				altText='四川大学'
 				imageClass='h-12 w-auto md:-left-16'
-			>
-				<ul class='ml-4 list-disc text-muted-foreground'>
-					<li>
-						Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolore debitis recusandae, ut
-						molestiae laboriosam pariatur!
-
-						<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae, pariatur!</li>
-					</li>
-				</ul>
-			</Card>
-			<Card
-				heading='Lorem Ipsum'
-				subheading='Sit amet consectetur'
-				date='Dec 2022 - Nov 2023'
-				imagePath='/src/assets/about-astro.png'
-				altText='Lorem, ipsum dolor sit'
-				imageClass='h-12 w-auto md:-left-16'
-			/>
-		</Section>
-
-		<Section title='Projects'>
-			<div class='flex flex-col gap-y-3 sm:flex-row sm:gap-x-3 sm:gap-y-0'>
-				<ProjectCard
-					href='https://www.google.com'
-					heading='Consectetur'
-					subheading='Lorem ipsum dolor sit amet consectetur adipisicing elit.'
-					imagePath='/src/assets/coming-soon.png'
-					altText='Example'
-					class='w-full sm:w-1/2'
-				/>
-				<ProjectCard
-					as='div'
-					heading='Coming soon...'
-					subheading=''
-					imagePath='/src/assets/coming-soon.png'
-					altText='Lorem, ipsum dolor sit'
-					class='w-full sm:w-1/2'
-				/>
-			</div>
-		</Section>
-
-		<Section title='Certifications'>
-			<Card
-				as='a'
-				heading='Lorem ipsum, dolor sit amet consectetur adipisicing.'
-				subheading='Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam dicta magni consequuntur corrupti.'
-				date='Mar 2024 - Mar 2024'
-				imagePath='/src/assets/about-astro.png'
-				altText='Lorem, ipsum dolor sit'
-				imageClass='h-11 w-auto md:-left-16'
-				href='https://www.google.com'
-			/>
-			<Card
-				as='a'
-				heading='Lorem ipsum, dolor sit amet'
-				subheading='Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam dicta.'
-				date='Mar 2029 - Mar 2032'
-				imagePath='/src/assets/about-astro.png'
-				altText='Lorem, ipsum dolor sit'
-				imageClass='h-11 w-auto md:-left-16'
-				href='https://www.google.com'
 			/>
 		</Section>
 
 		<Section title='Skills'>
-			<SkillLayout title='Languages' skills={languages} />
 			<SkillLayout title='Frontend' skills={frontend} />
 			<SkillLayout title='Backend' skills={backend} />
 			<SkillLayout title='Others' skills={others} />
+			<SkillLayout title='Languages' skills={languages} />
+		</Section>
+
+		<Section title='Projects' subtitle='(open source)'>
+			<div class='flex flex-col gap-y-3 sm:flex-row sm:gap-x-3 sm:gap-y-0'>
+				<ProjectCard
+					href='https://greasyfork.org/zh-CN/users/904256-kazoottt-wang'
+					heading='油猴脚本合集'
+					subheading='收录了我开发的一些油猴脚本'
+					imagePath='/src/assets/greasyFork.png'
+					altText='greasyFork'
+					class='w-full sm:w-1/2'
+					target='_blank'
+				/>
+			</div>
 		</Section>
 	</div>
 </PageLayout>