A Pen by mike-at-redspace on CodePen.
mike-at-redspace
/ iframe-viewport-emulator.markdown
Created
January 30, 2026 10:22
iFrame Viewport Emulator
mike-at-redspace
/ ambient-glow-showcase.markdown
Created
October 28, 2025 09:10
Ambient Glow Showcase
A Pen by mike-at-redspace on CodePen.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <svg class="sr-only"> | |
| <filter id="knockout-black" colorInterpolationFilters="sRGB"> | |
| <feColorMatrix | |
| type="matrix" | |
| values="1 0 0 0 0 | |
| 0 1 0 0 0 | |
| 0 0 1 0 0 | |
| -1 -1 -1 0 1" | |
| /> | |
| <feComposite in="SourceGraphic" operator="out" /> |
mike-at-redspace
/ color-palette-generator.markdown
Created
September 8, 2025 10:17
Color Palette Generator
An interactive tool to generate beautiful color palettes from any base color. Pick a color or randomize one, then explore complementary, split, triadic, and other harmony schemes. Copy HEX codes or full CSS variables instantly.
A Pen by Alexandre Vacassin on CodePen.
mike-at-redspace
/ der-bunt-color-harmonies-alpha-1-1.markdown
Created
August 7, 2025 09:57
Der Bunt: Color Harmonies (Alpha 1.1)
Todo:
- Optimise for touch
- 3d view of color distribution in different color spaces
- contrast ratio from selected color to all other colors
- save & export palette
- alternate palette views
A Pen by mike-at-redspace on CodePen.
mike-at-redspace
/ cheatsheet.md
Last active
July 17, 2025 08:25
Prompting Cheat Sheet (summer 2025)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <header> | |
| <section> | |
| <p>Hue</p> | |
| <div class="swatch max"><b><code>var(--color-max)</code></b></div> | |
| </section> | |
| <section> | |
| <div class="title-with-control"> | |
| <p>Options</p> | |
| <button id="shuffle" title="You can also press spacebar!"> | |
| <svg viewBox="0 0 24 24" width="17" height="24"> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // https://news.ycombinator.com/topcolors | |
| const colors = [ | |
| { | |
| value: "#ff6600", | |
| name: "Safety Orange", | |
| }, | |
| { | |
| value: "#00aadd", | |
| name: "Mystic Blue", | |
| }, |
mike-at-redspace
/ slug-generator.js
Created
June 6, 2025 07:50
Reusable Slug Generator with Stop Word & Format Options
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * A simple, customizable slug generator for browser-based inputs. | |
| * | |
| * Features: | |
| * - Optionally lowercases text | |
| * - Removes special characters | |
| * - Filters out stop words | |
| * - Removes numeric digits | |
| * - Supports dash or underscore delimiters | |
| * - Copy-to-clipboard functionality |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from "react" | |
| import { Swiper, SwiperSlide } from "swiper/react" | |
| import useSWR from "swr" | |
| const fetcher = (url) => | |
| fetch(url, { | |
| headers: { | |
| Authorization: `Bearer YOUR_JWT_TOKEN` | |
| } | |
| }).then((res) => res.json()) |
NewerOlder