Homepage
Open in app
Sign in
Get started
Design & Code Repository
UX & UI design with code
all
nana
Follow
Latest
Understanding the basics of React (feat. Next.js)
Understanding the basics of React (feat. Next.js)
Basic React for beginner or designer
nana
Feb 21
CSS Sprite sheet Animation: PNG
CSS Sprite sheet Animation: PNG
Learn about CSS Sprite sheet animation with PNG.
nana
Feb 21
Case study: Artist Kim Eull’s portfolio website
Case study: Artist Kim Eull’s portfolio website
UX / UI case study from IA, research, prototyping to CMS
nana
Feb 21
Galaxy layout with CSS Grid
Galaxy layout with CSS Grid
Learn about CSS grid for gallery
nana
Feb 21
📚Gallery Pattern references
📚Gallery Pattern references
Contemporary Art Museum & Gallery
nana
Jan 29
Case study: web design focused on interaction design.
Case study: web design focused on interaction design.
I always wanted to design a website using the latest web technologies, WebGL, SVG animation, and so forth.
nana
Sep 22, 2019
The story of editorial design for book ²/₂
The story of editorial design for book ²/₂
: The Art of Toy Story 4
nana
Jul 30, 2019
The story of editorial design for book ¹/₂
The story of editorial design for book ¹/₂
: Cookbook
nana
Jul 30, 2019
📚Web design reference
📚Web design reference
Collections updated 5 April 2019
nana
Apr 5, 2019
📚 List animation reference
📚 List animation reference
Collections updated 5 April 2019
nana
Apr 5, 2019
📚 Mouse cursor effects reference
📚 Mouse cursor effects reference
Updated: 27 Mar 2019
nana
Mar 26, 2019
CSS selectors cheatsheet & details
CSS selectors cheatsheet & details
📜 CSS selectors cheatsheet
nana
Feb 25, 2019
Cutup #8 Fluid Video
Cutup #8 Fluid Video
Today, I would like to talk about how to make a fluid video.
nana
Dec 17, 2018
Cutup #7 Box-sizing
Cutup #7 Box-sizing
Today, I would like to share with you about Box-sizing CSS property.
nana
Oct 29, 2018
What is a user agent
What is a user agent
A user agent is a computer program representing a person, for example, a browser in a Web context. -MDN
nana
Oct 28, 2018
Cutup #6 Breadcrumb bar with microdata
Cutup #6 Breadcrumb bar with microdata
Indicate the current page’s location within a navigational hierarchy that automatically adds separators via CSS.- Bootstrap
nana
Oct 8, 2018
Cutup #5 Icon with CSS /SVG sprite
Cutup #5 Icon with CSS /SVG sprite
Today I would like to share with you how to implementing icon in CSS. There are two ways to input icon in the web browser, CSS sprite and…
nana
Oct 4, 2018
Sketch dark mode on macOS Mojave
Sketch dark mode on macOS Mojave
🌝🌕🌖🌗🌘🌑🌚
nana
Oct 3, 2018
UI design #1 Handwriting Animation with SVG
UI design #1 Handwriting Animation with SVG
These days, I am designing a website for an artist, NamSin Kwak. This handwriting UI animation was designed for the intro page of the…
nana
Sep 29, 2018
Cutup #4 Image <figure>
Cutup #4 Image <figure>
🔮Today, I would like to share with you about the HTML <figure> element.
nana
Sep 27, 2018
Cutup #3 Link <a>
Cutup #3 Link <a>
Today, I would like to share with you about the HTML <a> element.
nana
Sep 25, 2018
Cutup #2 Margin
Cutup #2 Margin
Today, I would like to share with you about Margin.
nana
Sep 23, 2018
Cutup #1 Set up Typography
Cutup #1 Set up Typography
Today, I would like to share with you how to set up Typography (web font) in your boilerplate or framework.
nana
Sep 22, 2018
Sketch set as Default Style
Sketch set as Default Style
Set as Default Style
nana
Sep 20, 2018
About Design & Code Repository
Latest Stories
Archive
About Medium
Terms
Privacy
Teams