https://github.com/goganotclown/http-cats
This project allows you to retrieve cat images associated with different HTTP error codes. Enjoy a fun and entertaining way to visualize HTTP errors with adorable cat pictures.
https://github.com/goganotclown/http-cats
api cat-images css3 frontend fun-project html5 http-status-code interactive javascript mit-license responsive-design rest-api scss user-interface web-development
Last synced: about 1 month ago
JSON representation
This project allows you to retrieve cat images associated with different HTTP error codes. Enjoy a fun and entertaining way to visualize HTTP errors with adorable cat pictures.
- Host: GitHub
- URL: https://github.com/goganotclown/http-cats
- Owner: GogaNotClown
- License: mit
- Created: 2023-11-25T12:02:41.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-01T08:01:58.000Z (almost 2 years ago)
- Last Synced: 2025-06-19T13:53:54.189Z (12 months ago)
- Topics: api, cat-images, css3, frontend, fun-project, html5, http-status-code, interactive, javascript, mit-license, responsive-design, rest-api, scss, user-interface, web-development
- Language: CSS
- Homepage: https://http-cats.glitch.me/
- Size: 297 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# HTTP Cats
This project allows you to retrieve cat images associated with different HTTP error codes.
Enjoy a fun and entertaining way to visualize HTTP errors with adorable cat pictures.
[](https://postimg.cc/MMJYCqPX)
## Getting Started
To use this project, follow these steps:
1. **Clone the Repository:**
Ensure that Git is installed on your system.
```bash
git clone https://github.com/GogaNotClown/http-cats.git
cd http-cats
```
2. **Open the HTML File:**
Open the `index.html` file in your preferred web browser.
3. **Enter an Error Code:**
In the provided input field, enter an HTTP error code (e.g., 404) and click the "Get a cat 😺" button.
4. **Enjoy the Cat Image:**
The corresponding cat image for the entered error code will be displayed below the button.
## Technologies Used
- HTML
- CSS/SCSS
- JavaScript
## Styles and Variables
The component utilizes custom styles and CSS variables for easy customization. Here are key variables available in
the `style.css` and `style.scss`:
```css
:root {
--black: #111111;
--white: #FFFFFF;
--hover-white: rgba(255, 255, 255, .8);
--font: 'JetBrains Mono', monospace;
}
```
```scss
$black: #111111;
$white: #FFFFFF;
$hover-white: rgba(255, 255, 255, 0.8);
$font: 'JetBrains Mono', monospace;
```
## Additional Information
**Copyright:**
- HTTP Cats API created by [@rogeriopvl](https://twitter.com/rogeriopvl)
- Original Repository [🐱 HTTP Cats API](https://github.com/httpcats/http.cat)
- Original Website [Website](https://http.cat/)
**License:**
This project is licensed under the MIT License.
Enjoy Cats!