Desktop design

Tablet design

Mobile design

GitHub user search app

<a href="https://github.com/octocat"><h3 class="font-Space-Mono lg:hidden text-sky-blue md:text-base" style="opacity: 0.970018; transform: translateY(-2.99817px) translateZ(0px);">@octocat</h3></a>

<button class="h-11 bg-sky-blue w-20 font-Space-Mono text-white px-2 rounded-xl font-medium">Search</button>

<h2 class="font-Space-Mono font-bold text-base dark:text-white md:text-2xl" style="opacity: 1; transform: none;">The Octocat</h2>

<h3 class="font-Space-Mono hidden lg:flex text-sky-blue md:text-base" style="opacity: 0.970018; transform: translateY(-2.99817px) translateZ(0px);">@octocat</h3>

<h3 class="font-Space-Mono text-sm dark:text-white text-light-grey md:text-base " style="opacity: 0.911638; transform: translateY(-9.71987px) translateZ(0px);">Joined 25 Jan 2011</h3>

<p class="font-Space-Mono text-sm leading-6 md:text-base ml-6 w-72 md:w-11/12  text-light-grey" style="opacity: 0.766308; transform: translateY(-28.0431px) translateZ(0px);">This profile has no bio</p>

<p class="font-Space-Mono text-navy-blue dark:text-white">San Francisco</p>

<a class="font-Space-Mono break-words w-4/5  text-light-grey  dark:text-white" href="https://github.blog">https://github.blog</a>

<a class="font-Space-Mono text-light-grey bg-transparent" href="https://twitter.com/null"> <p> Not Available </p></a>

<a href="https://github.com/@github" class="font-Space-Mono text-navy-blue dark:text-white">@github</a>

Please log in to post a comment

Community feedback

Mobile First Github API User Search

Solution retrospective

Please log in to post a comment

Community feedback

Join our Discord community