Websites
Discover real websites made with Essepage and spark your creativity.
シンプルな紹介ランディングページ
スタートアップや個人開発者、クリエイターのための、シンプルでわかりやすいプロダクト紹介用ランディングページテンプレートです。
Loafly – A Lovely Template for Bakeries
Loafly (short for “Loaf + Lovely”) is a charming, ready-to-use website template designed especially for bakeries. With a warm aesthetic and clean layout, it’s perfect for anyone who wants to create a ...
Brad 블로그 템플릿 no.2
Essepage의 아티클 기능을 활용하여 제작한 블로그 템플릿입니다.디자인은 심플하면서도 세련된 느낌을 주는 Hugoplate 테마를 참고했습니다. 사용 방법 /post 폴더 아래에 새로운 폴더를 추가하면, 해당 폴더명이 카테고리가 됩니다. 각 아티클 페이지(파일명이 @로 시작하는 페이지)는 <essepage-meta> 안에 메타 정보를 꼭 입력해주세요....
블로그 템플릿
Hugo의 Paper 테마 디자인을 참조해서 만든 블로그 템플릿입니다.
selectedcontent 예제
<select> <button><selectedcontent></selectedcontent></button> <option> ... </option> </select>
TasteBrad 문의폼
이름, 이메일, 문의내용을 받을 수 있는 TailwindCSS 와 AlpineJS 로 만든 문의폼입니다. 이용자가 문의내용을 보내면, Discord 웹훅을 통해서 받아볼 수 있습니다.
SwiperJS 이미지 슬라이더
홈페이지를 만들 때 이미지 슬라이더를 위해 자주 사용하는 Swiper 코드를 정리했습니다. 주로 제가 많이 사용하는 옵션 위주로 작업되어있으니, 참고해주세요.
Video 태그 영상 자동재생
배경으로 쓰기 좋은 영상자동재생 템플릿입니다. 코드의 맨 아래에 있는 <script> 부분은 Safari 브라우저의 자동재생을 지원하기 위해 추가했습니다.
![{{#: Advanced [@ko] 어드밴스 [@ja] アドバンス:#}} Tailwindcss4](https://i.esdrop.com/d/f/HAbtTf0GsL/8zG2XbSjqG.jpg)
Advanced Tailwindcss4
Alpine.js and Tailwind CSS 4 Ready Full website sample with Navigation menu and Layout.
CoolClock Demo
CoolClock DEMOhttps://github.com/simonbaird/CoolClock Converted Original Demo for Modern Frameworks. Added WordClock with Black Skin. Using CoolClock Alpine.js Unocss
TasteBrad 웹페이지 기본 레이아웃(레스폰시브 적용)
Brad Taste 웹페이지 기본 레이아웃 홈페이지를 만들 때, 가장 많이 사용하는 레이아웃을 템플릿으로 만들었습니다. 💻 사용된 언어 및 프레임워크 HTML, CSS, UnoCSS(Tailwind CSS), AlpineJS 📙 사용법 웹페이지로 제작하려는 페이지 코드를 <main-layout> 으로 감싸주세요. <main-layout> <div...
![{{#: Advanced [@ko] 어드밴스 [@ja] アドバンス:#}} UnoCSS](https://i.esdrop.com/d/f/HAbtTf0GsL/Pe9OkXX83Z.jpg)
Advanced UnoCSS
Alpine.js and UnoCSS Ready Full website sample with Navigation menu and Layout.
![{{#: Essential [@ko] 에센셜 [@ja] エッセンシャル :#}}](https://i.esdrop.com/d/f/HAbtTf0GsL/Jk0fIuiPLO.jpg)
Essential
Full website sample with Navigation menu and Layout.
![{{#: Basic [@ko] 베이직 [@ja] ベーシック :#}}](https://i.esdrop.com/d/f/HAbtTf0GsL/wLfIaHnIS3.jpg)
Basic
Multi-page HTML codes with basic Layout.
![{{#: Simple [@ko] 심플 [@ja] シンプル :#}}](https://i.esdrop.com/d/f/HAbtTf0GsL/Y8Ce9NJuf9.jpg)
Simple
Single page HTML codes with Tailwind CSS ready.
![{{#: Bare [@ko] 최소 코드 [@ja] ほぼゼロから :#}}](https://i.esdrop.com/d/f/bh8rwl3bwU/4XY4FNWIy6.png)
Bare
Simple HTML codes with CSS design ready and Live Preview.
![{{#: Blank [@ko] 빈 페이지 [@ja] ゼロから :#}}](https://i.esdrop.com/d/f/HAbtTf0GsL/D5bgvp2Xmy.jpg)
Blank
If you want to start from zero, this template is best choice.
Essenote
note風ブログテンプレート
Pop Page Loding Style 01
Inspired by the official website of the anime ‘Too Many Losing Heroines’. It displays an animation layer when the page is shown, and hides the layer once the animation finishes. This method can also ...
Dark Mode Toggle
Dark Mode Basic Template: This guide introduces how to display a button for toggling dark mode and save the toggle state to LocalStorage when the user clicks the button.