Skip to content

ArkaGood/DESIGN-UI-KW

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 

Repository files navigation

DESIGN-UI-KW

DESIGN UI KW SECTION HOME

Awesome README Awesome

A curated list of awesome READMEs

Elements in beautiful READMEs include, but are not limited to: images, screenshots, GIFs, text formatting, etc.

Examples

  • ai/size-limit - Project logo, clear description, screenshot, step-by-step installing instructions.
  • aimeos/aimeos-typo3 - Project logo. Clear description of what the project does. Demo screenshot. TOC for easy navigation. Easy installation and setup sections with screenshots. Links for further reading.
  • ajeetdsouza/zoxide - Badges, project GIF, concise description, quick links, stepwise installation instructions.
  • alichtman/shallow-backup - Clear description of what the project does. GIF Demo. TOC for easy navigation. Badges. Links for further reading. Simple install instructions.
  • alichtman/stronghold - Project logo. Clear description of what the project does. GIF Demo. TOC for easy navigation. Badges. Links for further reading. Simple install instructions.
  • amitmerchant1990/electron-markdownify - Project logo. Minimalist description of what it is. GIF demo of the project. Key features. How to install guide. Credits.
  • amplication/amplication - Clear project logo. Brief explanation. All features explained. Clean documentation. Useful links (website, docs, discord). List of contributors with their pictures and usernames.
  • anfederico/Clairvoyant - Multiple badges. Clean logo. Simple install instructions. Clear overview of the project accompanied by a schematic. GIF demo. Extensive code examples.
  • ankitwasankar/mftool-java - Project logo with a short display of what can be achieved with it, TOC for easy navigation, important badges, clean installation guide, and multiple code snippets showing how to use the functionality.
  • aregtech/areg-sdk - Description of the project and use cases with explanation graphics. Build with multiple tools and integration instructions, reference to the guidance to create the first project. Examples. Project logo. Multiple badges. Headlines with graphics. TOC for easy navigation.
  • Armync/Arminc-AutoExec - Rich Markdown functions, modern layout, clear description and compliant with the recommended community standards.
  • athityakumar/colorls - Multiple badges. Clean screenshots. Simple install instructions. TOC for easy navigation. Good contributor guidelines.
  • ccostan/Home-AssistantConfig - Project Banner. Badges. Easy navigation.
  • choojs/choo - Badges, clean, clear. Beautiful little menu above the fold with useful links. An FAQ inside of it for the main questions. Backers. Good language.
  • chroline/well_app - Features attention-grabbing project thumbnail with clean badges, as well as download information and quick navigation links. Organized into multiple descriptive sections, each of which have a title with a yellow emoji. Includes details about the project itself, as well as the technologies used and how to contribute.
  • create-go-app/cli - Clean project logo. Useful badges (version, code style, test cover, docs). Clear readme with quickstart, understandable installation and usage manual, video screencast, ToC with well-documented project features (with a demo recording of the work in the terminal), project philosophy notes ("the why another"), most frequently asked questions, and more.
  • Day8/re-frame - Badges, logo, TOC, etc. Stands out by being a giant, well-written essay about the tech, how to use it, the philosophy behind it, and how it fits into the greater ecosystem.
  • dbt-labs/dbt-core - Project banner, super clear description (friendly to people brand new to the product), screenshot of the docs the tool generates, and concise links to other comprehensive pages explaining Getting Started, Joining the dbt Community, Bug Reports, Code Contribution, and Code of Conduct
  • dowjones/react-dropdown-tree-select - Clear readme with GIF screenshot for quick demo. Multiple badges, concise ToC, online playground, storybook, detailed description and more.
  • easybase/easybase-react - Project banner and logo. Badges. Expandable walkthrough sections. Concise description and purpose. TOC for easy navigation. GIFs for installation demo. Multiple informative visuals.
  • emalderson/thephish - Project logo, informative badges, useful TOC, clear description, screenshots, step-by-step installation and configuration guide, contributor guidelines, code of conduct, UML diagrams, coherent tags, issue and pull request templates, well-documented and well-commented code, examples.
  • github-changelog-generator/github-changelog-generator - TOC for easy navigation. Concise project description. Installation and usage sections. Output example. Great feature overview. List of alternatives. FAQ.
  • gitpoint/git-point - Clear description. Project Logo. App Store logos. TOC. Clean screenshots. List of features. Detailed installation process. Landing Page.
  • gofiber/fiber - Clean project logo. Useful badges and links (languages switcher, code style, test cover, docs, Discord channel). Clear description of what the project does with quickstart, benchmark charts, well-documented code examples (with the ability to hide long content), project philosophy notes ("the why of project"), tables with project addons, list of contributors, star growth statistics, and more.
  • Hexworks/Zircon - Dogfood in readme. Clear description of what the project does. Demo screenshot. TOC for easy navigation. Easy installation and setup sections with screenshots. Links for further reading.
  • httpie/httpie - Description of what the project does. Demo screenshots. Project logo. TOC for easy navigation. Build badges. Quick and simple installation and usage sections. Includes an examples section.
  • iharsh234/WebApp - Project landing page. Clear description of what the project does. Demo screenshot. Simple install and usage sections. Includes an examples section with common uses and a mobile demo section.
  • iterative/dvc - ReStructuredText format example, PyPi compatible. Logo, custom website-like menu. Smooth how-it-works animation. Badges. Nice contribution section with the hall-of-fame.
  • karan/joe - Project logo. Clear description of what the project does. GIF demo. Easy install and usage sections.
  • kopach/karma-sabarivka-reporter - Project logo. Useful badges, clear readme with screenshots for quick demo. Concise ToC.
  • L0garithmic/FastColabCopy - Project logo. Minimalist description. Badges. GIF demo. About The Project. How To Use. Examples. Credits. Additional Examples.
  • ma-shamshiri/Human-Activity-Recognition - Beautiful table of contents. Project logo. Animated project banner. Complete project folder structure. Clear description of what the project does. Nice contributors’ section. Easy navigation.
  • ma-shamshiri/Pacman-Game - Beautiful table of contents. Project logo. Animated project banner. Suitable GIFs to display each part of the project. Complete list of project files in the repo along with their function. Complete execution instruction.
  • ma-shamshiri/Spam-Detector - Complete project file description. Project logo. Animated project banner. Concise project description. Clear execution instruction.
  • MananTank/radioactive-state - Badges (version, downloads, coverage, size), Twitter Intent, Project Logo, Feature list, Motivation, Installation, Example with GIFs, Emojis, Collapsible Sections, Live Demos, API detailed usage, FAQs, Chat link.
  • Martinsos/edlib - Informative badges (build, version, publication). Concise description. Feature list. TOC. Screenshots. Concise instructions with examples for building and including in your project. Common code examples to get you started quickly.
  • NASA/ogma - Clear description. Feature list. Demo GIFs. Simple install instructions. Usage code samples. TOC for easy navigation.
  • ngcolombia/medellin - Project banner. Badges for stats. Well placed emoticons. Contributor's photos.
  • nhn/tui.editor - Project logo. Clear overview of project features with a demo GIF. Badges. TOC for easy navigation. Colorful icons in front of titles.
  • node-chat - Project screenshot. Informative badges. Clear description. Easy installation/use instructions. Live demo.
  • NSRare/NSGIF - Project logo. GIF Demo. Usage artwork. Usage code samples.
  • OliverOverend/gym-simplifiedtetris - GIF demo. Short description of the project. Badges. TOC. Installation and usage instructions, with copy-pastable comments and dependencies. Contributing file. Overview of the environments and agents provided.
  • php-censor/php-censor - Multiple badges, project logo, screenshots, step-by-step installing and upgrading instructions, TOC for easy navigation.
  • PostHog/posthog - Custom-made section icons, demo GIF, deploy button, profile images for contributors, concise, clear structure, project logo.
  • priyavrat-misra/xrays-and-gradcam - TOC for easy navigation. Clear introduction of what the project does. Complete list of all files in the repo and what their function is. Usage section. Clean and concise tables.
  • React on lambda - Project logo, comics to present the main idea, badges, examples with code snippets, demo projects, api documentations, editor configurations.
  • React Parallax Tilt - GIF demo. Multiple badges. Feature list. Great live demo with code examples. Easy to follow instructions for local development set up.
  • Rebilly/redoc - Multiple badges, project logo, live demo link, GIF-animations of the key features, TL;DR usage.
  • refinedev/refine - Clean project logo. Brief description at top. Multiple badges. Usage description and examples. Use cases and demo links. Screenshots. Key Features. Contributors. Stargazers. Contribution guidelines.
  • release-it/release-it - Clear overview of project features with a demo GIF. Badges. Expandable TOC. Usage description and examples. Contribution guidelines. Detailed releases.
  • rstacruz/hicat - GIF demo. Easy installation and setup sections with screenshots. Build badges. Great examples of use cases.
  • ryanoasis/nerd-fonts - Clean project logo. Brief description at top. Sankey diagram, quick links, badges, OS specific icons, TOC, detailed release changelog.
  • sebyddd/SDVersion - Project logo. Build badges. Documentation structuring for multiple programming languages. Usage examples.
  • shama/gaze - Project logo. Concise description. Feature list. Usage section. FAQ. Great API documentation. Release history.
  • sidneycadot/oeis - Overview. List of required dependencies. Complete list of all files in the repo and what their function is. Visual graph of how it all ties together.
  • sindresorhus/pageres - Project logo. Clear description of what the project does. Build badges. Demo screenshot. Simple install and usage sections. Includes an examples section with common uses.
  • sourcerer-io/sourcerer-app - Clean animated screenshot. Customized call to action badge. Usage showcase.
  • sr6033/lterm - Clean logo using characters. Brief updates on development. Detailed contribution guidelines. Contribution suggestions.
  • Stack-in-a-box/triumphmayflowerclub.com - Stands-out because, while only a simple website, it is presented as a very open project for lesser-experienced developers to cut their teeth on, with a friendly, inclusive tone and accessible set-up instructions. Includes many common elements found in other beautiful READMEs.
  • sulu/sulu - Project logo, useful badges, clear instructions on where to find more information and report bugs, GIF screenshots, nice use of emoticons.
  • supunlakmal/thismypc - Project logo. Useful badges. Web site URL. Screenshot. GIF step-by-step instructions for installation. Project folder structure.
  • teles/array-mixer - Clean project logo, badges. Table of contents. Contributing section. Many illustrated examples.
  • thelounge/thelounge - Project logo. Useful badges and links (website, docs, demo). Screenshot. Feature list. Step-by-step instructions for installation, development, and testing. Link to the contributing guide. Good mobile summary.
  • vhesener/Closures - Project logo, cognitive funnel, animated examples. Color coordinated. Clean documentation.
  • xnbox/DeepfakeHTTP - Original hero section. Clear navigation. Minimalist design. Appendices.
  • zenml-io/zenml - Clean project logo. Useful TOC. Clear code examples amongst feature list. Quickstart example.

Articles

Tools

  • Amazing GitHub Template - Useful README.md, LICENSE, CONTRIBUTING.md, CODE_OF_CONDUCT.md, SECURITY.md, GitHub Issues, Pull Requests and Actions templates to jumpstart your projects.
  • Common Readme - A common readme style for Node. Includes a guide and a readme generator.
  • Feedmereadmes - README editing and project analysis/feedback.
  • GitHub Readme Stats - Dynamically generated customizable GitHub cards for README. Stats, extra pins, top languages and WakaTime.
  • Hall-of-fame - Helps show recognition to repo contributors on README. Features new/trending/top contributors. Updates every hour.
  • Make a README - A guide to writing READMEs. Includes an editable template with live Markdown rendering.
  • README best practices - A place to copy-paste your README.md from
  • readme-md-generator - A CLI that generates beautiful README.md files
  • Readme.so - A simple editor that allows you to quickly add and customize all the sections you need for your project's readme.
  • READMINE - A thorough, clear and self-describing README file template for software projects; copy it and edit it as needed.
  • StackEdit - A user-friendly online editor that allows you to quickly customize all the sections you need for your project's readme.
  • Standard Readme - A standard README style specification. Has a generator to help create spec-compliant READMEs, too.
  • user-statistician - A GitHub Action that generates SVG of detailed GitHub user activity for profile readmes.
  • Zalando's README Template - Simple template to help you cover all the basics.

Creating GIFs

Embedding an animated gif in your README quickly demonstrates what your project does and catches the reader's eye. Here are a few programs that can help you quickly create gifs for your project:

  • Gifox - $14.99 - Clean UI, hotkeys, lots of advanced features.
  • Gifski - FREE - More vivid colors than the rest, but still keep size low.
  • Giphy Capture - FREE - Easy to upload to giphy.com, slightly annoying UX.
  • LICEcap - FREE - Less intuitive, more features.
  • Peek - FREE - Simple and easy to use for Linux users.
  • Recordit - FREE - Simple, clean UI, but auto-uploads to Recordit.
  • ScreenToGif - FREE - Open source, customizable UI and easily editable GIFs, easy to get started.
  • terminalizer - FREE - Record your terminal and generate animated gif images or share a web player.
  • ttystudio - FREE - For commandline tools, a terminal-to-gif recorder minus the headaches.

Get Feedback

  • feedmereadmes - Free README editing+feedback to make your open-source projects grow. See the README maturity model to help you keep going.
  • maintainer.io - Free README standardization and feedback, if you click on 'Book an audit'.

Contribute

Contributions are always welcome! Please read the contribution guidelines first.

License

CC0

To the extent possible under law, Matias Singers has waived all copyright and related or neighboring rights to this work.