페이지
라이브 데모의 페이지별 스크린샷입니다. 페이지 안에서 스크롤하면 전체를 볼 수 있습니다.
디자인 분석
이 템플릿 디자인을 AI가 분석한 내용입니다: 색상, 글꼴, 여백, 섹션, 특징적인 디테일. 템플릿을 사용하면 Ottermind가 여기에서 시작합니다.
이 분석은 아직 한국어로 제공되지 않아 영어로 표시됩니다.
- Overall
personal portfolio, tech-forward, high-density, dark
- Palette
background #000000; surfaces [#18181b, #e5e7eb, #ef4444, #22c55e]; text #fafafa; muted text #a6a6a6; primary #20beff; accents [#ef4444, #22c55e, #eab308]
- Type
headings Inter, 900, uppercase/sentence-case; body Inter, 12px; scale h1 158px / h2 88px / h3 36px
- Shape & spacing
button radius 9999px, card radius 16px, borders none, shadows rgba(255, 255, 255, 0.1) 0px 0px 0px 1px, section spacing 120px, content width 1138px
- Sections (top to bottom)
- Hero — full-width, centered stacked headline with icon integration (lightning bolt, robot head), vertical sidebar label "AVAILABLE FOR OPPORTUNITY", top navigation bar with time display and icons, location tagline at bottom right, scroll indicator
- Core Focus — centered quote block with red border, three-column layout below with labels in red, descriptive text in white/muted gray, signature script at end
- Professional Statistics — centered text block above horizontal stat bar with four data points, rounded container, green status dot above
- Contact — full-width form with large heading, input fields labeled in uppercase, "SEND MESSAGE" button with arrow icon, social grid of platform cards with connect buttons and icons
- Footer — implied continuation with contact links and branding
- Signature details
- Dynamic iconography embedded in text (lightning, robot, camera)
- Vertical sidebar label with rotated text
- Red accent borders around key sections
- Floating scroll indicator with animated transition
- Monochrome palette with strategic color highlights
- Script signature for personal touch
- Other pages
- /contact: form-based layout with social connection grid and messaging interface
템플릿 정보
- 카테고리
- Portfolio, AI
- 제작자
- larsen66
- 게시처
- 21st.dev
- 가격
- 무료
- Portfolio
- AI
- Personal Website
원본 디자인: larsen66 (21st.dev에 게시). Ottermind는 템플릿 코드를 복사하지 않고, 브리프를 바탕으로 새 사이트를 만듭니다.
Ottermind가 시작하는 브리프
Studio에서 초안으로 열립니다. 보내기 전에 브랜드, 대상, 페이지를 추가하세요.
Build a portfolio website inspired by the "Arfazrll Portfolio" template. Reference brief: Immersive AI engineer portfolio with WebGL scenes, technical case studies, bilingual content, live GitHub and WakaTime stats, and a dual-provider AI chatbot. Style and features to reflect: Personal Website. Use original copy and imagery for my brand rather than the reference's placeholder content.
이 템플릿 사용 방법
- 1
“이 템플릿 사용하기”를 누르면 브리프가 채워진 상태로 Ottermind Studio가 열립니다.
- 2
브리프에 브랜드, 대상, 페이지, 콘텐츠를 추가하세요.
- 3
Ottermind가 이 디자인에서 영감을 받은 새 사이트를 만듭니다. 채팅으로 계속 다듬으세요.
