Neural Net Generation

Can we simply prompt a generator for “fancy capital letter A”? No.

Generating dropcaps with text2image neural nets has proven tricky, due to a combination of flaws like my old nemesis byte-pair encodings, raster-only output, and surprisingly poor typography.

DALL·E 2, Stable Diffusion 1.5 (eg., including with Textual Inversion, eg.) & SD-XL distilled (eg.), Midjourney v1–4, Adobe Firefly-2, all showed exciting possibilities, but were weak on generating images of letters: in some cases, they were entirely unable to generate a specific letter, while in others they were unable to generate variants like italic or bold, and the overall quality was disappointingly low. We weren’t excited enough to pursue the idea with them. However, when I experimented with Midjourney v5 in late 2023 (MJv6 was January 2024), it had reached a quality level where I could brute-force good dropcaps, and I was pleased with samples like medieval-style cat dropcaps. They still did not support good ways to get a single consistent style of lettering or illustration, with no LoRA or equivalent features (aside from possibly the DALL·E 3 ‘seed’ feature), but we decided to embrace that limitation and make a diversity of dropcaps instead of aiming for complete consistency: if we could make many instances of a letter, then we could randomize the choice⁴

With MJv5, one could make heavy use of its 4-at-a-time ‘vary’ & inpainting functionality to generate many variations of good samples and gradually explore nearby images. (I also used the MJ /describe command to get loose hints as to useful keywords based on uploading yinit samples, although /describe has never worked for me in replicating a specific image.) This let us generate several hundred possible candidates, which Said Achmiz could screen down.

After dialing in a good prompt, I would pick best-of-4, and then Achmiz would pick best-of-5 from that (with an eye towards what would look good downscaled to dropcap size⁵), so to get a set like the 74 dropcats, I would have generated 1,000–1,500 total. This was well within the ~$10 MJ monthly subscription⁶, and I would say that by the end, I was able to do this within about 2 hours total (and was getting faster)⁷, so that would ballpark the dropcats at <$0.10 & <1.5min/each.⁸ So one could easily generate 1 dropcap per blog post if one wanted to, or create a large site-wide set in an evening.

We also tried using DALL·E 3 (through the OA ChatGPT web interface, not Bing or any API), with acceptable results. Qualitatively DALL·E 3 is much more ‘accurate’ and able to ‘follow instructions’ in a prompt, but also less ‘creative’: it rarely screws up a letter-shape (eg. vampires), but few of them strike me as all that artistic. (There are rarely any pleasant surprises like an unexpected rubri-cat-ed dropcat or happy accidents like the “trypophobia” horror dropcaps or stumbling into a striking “black sun” region of latent space⁹; for an example of a DALL·E 3 font, see “Cryptic Creatures” TTF) The chat-based interface is also slow: MJ at least lets you queue up several jobs in a row, particularly with ‘vary’, so you can generate a few dozen quickly, but the chat-based interface forces you to generate 1 image at a time, taking a minute each time. (One can open multiple tabs, but only a few will work.) So DALL·E 3 is a good choice if you’re aiming for a precise dropcap or you are fine with picking from the first few, but not if you want a lot or a diverse set. I currently use it mostly for complex images like my essay thumbnail-illustrations (eg., popup/popover) or comics (eg.), where Midjourneyv5 was hopelessly inefficient.

Raster Image

OK, so we now have an image we like. It is a 2MB PNG; we can stick it into a web page as an ordinary <img>/<figure>, the way everyone else uses their AI-generated art. Sometimes this will work, like this elegant lady of obscure letter-origins I found while generating rococo dropcats:

But how do we use some random PNG or JPG as a dropcap?

Raster Problems

If we edit our CSS to just stick in a PNG dropcap at the start of a paragraph (much like the standard TTF+::first-letter CSS pseudo-element approach), we see problems:

1. the letter itself inside the dropcap image will be positioned badly relative to text. It will be too far away left or right, or the image may actually overlay & erase our text.

   We need the letter to be aligned with the first sentence, and reasonably snug with the text wrapping around it, but not so snug that bits might overlap, which will look ugly and make the text hard to read. (This is especially an issue with more extravagant dropcaps, or letters which stick out a lot, like ‘Q’.)

   To handle this, we must edit the image and crop it down to reposition the letterform appropriately, imagining that there is text wrapping around the right & bottom.

2. the dropcap image has a background; unfortunately, it is always the wrong background.

   The NNs always generate a background color. There are ways to not generate a background color, like emitting an alpha channel or semantic segmentation mask, or generating vector art formats like SVG. However, the current NNs (as of November 2023) do not use any of these. So if we get a great dropcap, it will come with some background. It might be black, it might be white, it might be an off-gray gradient. But it will be there, and it will almost always be different from the web page background, and so there will be an ugly ‘square’ if we simply use the PNG as-is.

   This is not an issue for normal fonts, because they draw the letter directly against an unspecified background, like it was text, so there is no problem ‘superimposing’ them onto a white or black webpage. It is also not a problem with the rare sets of image dropcaps, like Mario Zucca’s Grantland baseball dropcaps where he created transparent GIFs (presumably having drawn them using a computer without background in the first place). It is finally not a problem if one deliberately aims for all dropcaps having a solid or otherwise entirely colored background, and accepts that limitation and how obtrusive they may be. However, our dropcap PNGs are just big grids of colored pixels, which don’t “know” what is a ‘background’ or ‘foreground’ or ‘letter’.

   The simple but labor-intensive solution is to use a raster image editor to try to remove the background: they support various approaches like ‘delete all pixels of a particular (background-only) color’ or provide various ‘wizards’ or ML-based algorithms. (One would also do any additional editing here: delete minor artifacts like smudges in the corner, which are pseudo-signatures/watermarks, or convert to grayscale, so as to fit the Gwern.net monochrome theme.) This works, but it is tedious.

   (Machine learning solutions seem like an obvious solution, but are still largely prototypes hacked onto segmentation models; the first appealing image generation model with ‘native’ transparency I’ve seen wasn’t published until March 2024.)

3. the dropcap image may not work when inverting color for dark vs light-mode

   A monochrome dropcap (like the original ones used on Gwern.net) which works in light-mode will usually work in dark-mode, for the same reason that it is compatible with different background colors: it simply draws (usually solid) lines. These lines are usually all-black on an assumed white-background, but will look good if switched to all-white on an assumed black background. So while we chose our dropcap fonts with light-mode in mind, before we had a dark-mode, dark-mode support was trivial.

   An image dropcap, however, is not so simple: we can’t just invert it because of the background square. To solve the #2 problem of backgrounds, we may have carefully tried to cut away the background pixel by pixel, but we probably left the occasional background-colored pixels on the edges; if we naively invert the trimmed light-mode image for dark-mode, there will be no background square, that is true, but all those suddenly our beautiful image dropcap is now ‘dusty’ with white speckles, like a coke fiend, and vice-versa (eg. one of our favorites, “hissing kitten” looks terrible when inverted, as do most of them).

   We can manually curate ones which invert poorly… but then the fact is that many of our colorful & creative dropcap images just won’t look good when inverted. Just like how an inverted photograph may look bizarre, a good image may look terrible when inverted. There is no mechanical solution—the inverted image is useless, and it has to be redrawn.

4. the dropcap image is too big, in both size & pixels:

   The original image you download tends to be highly unoptimized and weigh several megabytes. This is unacceptable for web use for a decorative element. (If the image were the centerpiece of the page, or the only content on the page, that would be one thing, but just for a bit of decoration? Unacceptable delay & bloat, particularly in a world where bandwidth still costs readers real money.) We can shrink it down to more like 0.5MB with standard image optimization utilities, but this is still too large.

   This is a second problem to large images: if we ship a 1024px-high image where the largest dropcap height would be 188px, the browser will have to downscale it, and, in the interest of rendering speed, browsers do not scale images well. So our dropcap image will be unnecessarily blurry and undermine the visual quality we worked so hard for.

   To solve this, we need to manually create a small 188px image for use instead. This will weigh much less, maybe 10–100kb, and the browser will not have to rescale it (which will be faster too). The catch? We actually need two downscaled images: because some devices, like Apple Retina screens¹², define double-pixels, so if we shipped them the ‘188px’ version, it would be rescaled to 376px and look bad again. So we have to create a 188px & 376px version. (Oy vey.)

Overall, our raster image editing process might go like this, for each image:

• N = lines dropcap must span

• H = visual height of n lines (top of x-height to bottom of x-height)

• Y = total height of image (bounding box) such that letterform is H tall, allowing for ornaments/etc.

Example values for dropcats:

• N = 5 lines

• H = 144 px (7.2em @ 20px base font size)

• Y = 188 px (9.4em @ 20px base font size)

Create master image file:

1. Convert to grayscale

2. Adjust levels such that background is white / black respectively

3. Scale image such that letterform is 4H tall

4. Adjust canvas height to 4Y

5. Adjust canvas width such that ~40px remain on either side of glyph

Create scaled assets:

1. Scale master image to 25% (total height = Y) and save as letter-ID-small-1​x.png

2. Scale master image to 50% (total height = 2Y) and save as letter-ID-small-2​x.png

3. Make scaled images transparent (convert to 8-bit color, fill background with magenta, set magenta to transparent color)

We then wrote some JS to, for pages with a specified CSS class set on the body (eg. dropcaps-dropcat), load a random PNG (picking from the light vs dark-mode sets) and use that. (This required switching away from actual use of CSS ::first-letter pseudo-elements in favor of regular elements, but that also means we can do more with them—eg. make them pop up a link to this page as their documentation. When JS is unavailable or dropcaps are disabled due to a narrow window, dropcap-ed paragraphs simply render normally because they are an optional esthetic feature.)

This JS is integrated with the website build process, so a list of available dropcaps is generated by looking at the dropcap font directories.¹³

Our test case was the dropcat set, and we were pleased with the result: they look great in both modes, hardly ever repeat due to their sheer number, load about as fast as the rest of the page (and as fast as the original subsetted dropcap would), and hasn’t been buggy.

Vector Image

We were able to do all the dropcats, but quickly became bogged down in the sequel, a set of horror/vampire/sci-fi themed dropcaps for my Gene Wolfe essays: it was just too d—ned tedious to do more than a few. We discussed alternative approaches (perhaps we could drive raster edits using GPT-4-V? Or use one of the new neural net segmenters to remove backgrounds more cleanly? Use ControlNet to create light vs dark mode versions?) but the most straightforward fixes kept coming back to vector images: if we were using vector images, everything would be a lot easier.

Could we use TTF like our existing dropcaps? Apparently TTF does support storing raster images in it, but it is an extremely obscure & little-used feature, and wouldn’t help in any meaningful sense: we would still need to get vector versions somehow.¹⁴

Could we use a NN generator which generated vector output instead? There is, strictly speaking, no reason that a NN couldn’t generate some sort of vector output or optimize a set of vectors or generate SVG text directly like any other LLM output. There have been a number of approaches, ranging from the cool reinforcement learning approach of SPIRAL to more contemporary image2vector StarVector. But it is neglected compared to regular raster image generation, in part because NNs are extremely good at just generating a big pixel grid of blobby textures rather than emitting long carefully-written symbolic text strings like SVG files. There seemed to be only the new & little-discussed Adobe Firefly-2, and I learned from Nat Friedman, an obscure London-based startup called Recraft.ai.

I tried Firefly-2 in October 2023, and with the free credits, was not impressed by the dropcaps, like all the others. (This was surprising to me because Adobe is a major player in the font space—if anyone was going to do good generative typography, you’d think it would be them!)

I then tried Recraft.ai’s (also free) vector generation, and was unimpressed (eg. Art Deco capital ‘A’); Recraft would be majorly upgraded in late January 2024, however, while testing it in October 2023, I noticed that they had a ‘vectorization’ feature for importing raster images to then edit, and further, a ‘remove background’ feature. I haven’t had good experiences in the past with vectorization tools like potrace, which tend to produce both low-quality and large SVGs, but I gave it a try and I was pleasantly surprised to see that vectorization+remove-background yielded usable SVGs without their backgrounds, and, particularly after running through Vecta’s “nano” SVG minifier¹⁵, usually ~1MB. This accomplished the first step: vectorizing our dropcaps.

We investigated further and discovered that Recraft’s vectorization→remove-background workflow was actually highly suboptimal: the ‘vectorization’ step produced an SVG which always had the background neatly split apart from the rest of the image, and which could be deleted without any further problems, while the ‘remove-background’ step did some sort of global rewrite of the entire SVG which introduced a lot of visual artifacts & often resulted in a larger filesize to boot. (This was puzzling, because why didn’t Recraft just implement remove-background the easy way?) Achmiz wrote a script to remove the background, svg_strip_background.php, which shrank the SVGs and achieved the second step: removing the backgrounds from the vectors.

Achmiz then noticed that the size of the SVG was driven mostly by long decimal numbers in the SVG, but that they truncate to just a few digits with no perceptible difference, particularly at dropcap scale. (Oddly, Vecta’s nano doesn’t appear to do this before doing its own minification, so this improvement stacks with running it through nano; however, whatever nano does to SVGs does eliminate the benefit of truncation.) The truncation script is available as svg_squeeze.php. By truncating and then minifying with nano, the SVG sizes shrink to a downright-reasonable 10–100kb! (We had been prepared to accept SVG sizes of up to 500kb, on the grounds that bandwidth is getting cheaper all the time and only desktop users would download dropcaps, and we could always go back in the future with better vectorizers, which we expect to arrive in the next few years as neural nets catch up.)

This leaves one key step: adjusting the margins/sizes of the dropcaps.

Vectorizing doesn’t auto-magically solve that, but it does mean that it’s a lot easier, because now one is simply setting a few parameters in the SVG to move the object around and make it bigger or smaller, which is meaningless in a raster image. It is so simple, in fact, that you can write a small in-browser editor app just for that purpose. To finish up an SVG dropcap, one simply opens it in the editor, fiddles with it for a few seconds, and export the adjusted dropcap.

So, to recap:

1. obtain a PNG/JPG dropcap:

   This can be from anywhere—social media, magazine scans, photos, one’s favorite NN generator, hand-drawn, screenshot, video game—as long as it would make a sensible dropcap: roughly square-shaped, looks reasonable downscaled to 188px, not too cluttered or detailed, a ‘background’ which can be removed, few colors (preferably monochrome)…

   • rescale to 25%: for dropcap use this can sometimes result in SVGs half the size while having no perceptual difference side-by-side at dropcap-scale (and sometimes the smaller resized one looks better); however, it is unreliable, and sometimes makes larger images

   • grayscale: for dropcaps which are intended to be monochrome, grayscaling the image before vectorizing appears to usually work better

2. log into Recraft and ‘vectorize’ it

3. run svg_strip_background.php on it

4. run svg_squeeze.php on it

5. run Vecta nano on it

6. edit the positioning in Dropcap Workshop

7. save to a directory

While still more work than we would like, only the first and penultimate steps require any real effort, and the workflow can be improved: the vectorization & optimization steps could be all combined, and I believe that the positioning can eventually be automated with judicious use of AI—at which point human effort is only required for selecting the dropcap image.

Dropcap Workshop

Dropcap Workshop is a single-page standalone/offline MIT-licensed web app made by Said Achmiz for editing SVG dropcaps, specifically, adjusting their height (ie. zoom in/out) and margins (cropping):

It supports uploading & editing multiple SVG simultaneously, so one can edit dropcaps in batches: bulk-edit, and then adjust one by one before saving. The original dimensions are saved in the edited SVG just in case.¹⁶

Code

The JS for raster & SVG dropcaps is in rewrite.js & misc.js. The build-time infrastructure is largely in build_asset_versions.php/font_spec.php (for convenience, triggered by the git pre-commit hook so any saved changes trigger an update of the list of available dropcaps).

Dropcap Workshop’s source code is the page itself, which is self-contained so it can be saved locally & used offline.

Dropcat

• Dark:

  1. B: 4

  2. C: 3

  3. G: 7

  4. I: 1

  5. Q: 13

  6. T: 4

  7. total dark dropcats: 32

• Light:

  1. B: 7

  2. C: 5

  3. G: 10

  4. I: 1

  5. Q: 12

  6. T: 7

  7. total light dropcats: 42

• Pages using dropcats: this page · “Cat Psychology & Domestication: Are We Good Owners?” · “Why Cats Knock Stuff Over” · “Fuzz Testing” (by cats) · cats & human earwax · “Catnip immunity and alternatives” · worldwide catnip surveys · optimal catnip testing · catnip breeding

An interesting Midjourneyv5 prompting discovery was that use of the ‘Korean’ term often produced a nifty East Asian effect which was neither stereotypically Chinese nor Japanese.

Gene Wolfe

For unrelated reasons in August 2023, I was tidying up a detail in my analysis of the Gene Wolfe short story “Suzanne Delage”, a mystery I had given up as insoluble a decade before, when I abruptly solved it as a retelling of Bram Stoker’s Dracula, and began obsessively rewriting the analysis with the parallels. For kicks, I added a bit of flair from Midjourney, and then, while making the dropcats, thought that it would be neat to have some vampire-themed dropcaps to illustrate—after all, they were now so cheap & easy to generate, that it would make a good example of customized dropcaps. (I was also a little envious of the New Sun Folio Society edition dropcaps by Sam Weber.)

My Wolfe essays start with ‘F’/‘T’/‘V’, so I decided to make dropcaps for those letters.

As an experiment, I asked GPT-4 for keyword suggestions about Wolfean themes which would make for good dropcaps, as some Wolfean themes like “unreliable narrator” seem like they’d be hard to convey visually. Its better suggestions were objects (“vampire”, “space ship”, “executioner sword”, “wolf”), themes (“fantasy”, “Catholic”, “Book of the New Sun”), and fonts (“blackletter”/“Textura”/“Rotunda”/“Bastarda”, “Uncial”, “Insular”, “Carolingian”, “Fraktur”, “Humanist”). I used those as seeds in writing a bunch of MJv5 prompts¹⁷ for my usual ‘brute-force, vary, and curate’ approach.

This was quite successful in producing attractive dropcaps (particularly with ‘V’, but the usual difficulties with ‘F’) and we selected (demo page):

• light-mode: 93

  • F: 16

  • T: 26

  • V: 51

• dark-mode: 72

  • F: 10

  • T: 16

  • V: 46

• total: 165

Because converting the PNGs by hand was too tedious, we used the Wolfe dropcaps to develop the SVG workflow.

The light-mode dropcap montages:

The dark-mode dropcap montages:

Ninit

ninit is our in-progress neural-net/AI/machine/steampunk-themed dropcap set. It is intended for use in my AI articles (such as this one): I like the symmetry of using AI-created art to illustrate my AI art articles, and I have been periodically poking at AI image generators over the years to see if they were up to it. (Finally, they were.) So ninit’s name is a riff off yinit (our most common dropcap): it is a ‘neural yinit’ or ‘ninit’.

For ninit, I have been experimenting with a mix of both Midjourney & DALL·E 3: using a large number of overlapping MJ prompts for diversity, and trying out asking DALL·E 3 to generate letters in a consistent style. (I haven’t decided if I want ninit to be solely AI-generated, any style acceptable, or AI-seeming, requiring some sort of AI-related motif like robots.)

Some of the styles I have been trying out: fancy floral (monochrome: 1, 2; color: 1, 2, 3, 4), Victorian abstract mechanical (1, 2), circuit boards, robots (1, 2, 3; honorable mention: ‘robotic expressionism’ faces).

ninit is paused while we nail down the SVG workflow (no point generating lots of nice PNGs if we can’t process them into usable dropcaps).

Samples:

• Light-mode:

  • Midjourneyv5 prompts:

    Capital letter T in simple blackletter, monochrome, abstract, German, machine clockwork, simplistic vector art,
        typography, Dave gibbons, robotic expressionism, mid-century illustration, bold use of line, autopunk, cyberpunk, steampunk --no intricate complex, detailed, color, red, yellow
    Capital letter T in simple blackletter, monochrome, abstract, German, machine, simplistic, vector art,
        typography, mid-century illustration, bold use of line, autopunk, cyberpunk, steampunk --no intricate complex, detailed, color, red, yellow
    Capital letter T in simple fraktur blackletter, artificial intelligence, neural network, deep learning,
        human brain, perceptron, Transformer, German, linocut
    Capital letter T in simple fraktur blackletter, artificial intelligence, neural network, deep learning,
        brain, German, Gothic, monochrome, linocut
    Capital letter T in simple fraktur blackletter, German, Gothic, monochrome, linocut, vector,
        neural net, circuitboard, AI, SF
    Capital letter 'T': a black and white drawing of a letter, high contrast, arabesque/scroll,
        striking simple design, art deco 1969, precisionist lines and detail-oriented, quadratura, bold lettering, linocut
    Capital letter 'T': a black and white drawing of a letter, simple abstract design, calligraphic arabesque/scroll,
        renaissance, art deco 1969, precisionist lines and detail-oriented, quadratura, sabattier filter, bold lettering, simplified woodblock, linocut
    Capital letter 'T': a black and white drawing of a decorative fancy ornamental letter, simple abstract design,
        calligraphic arabesque/scroll, renaissance, art deco 1969, precisionist lines and detail-oriented, quadratura, sabattier filter, bold, woodblock, linocut
    Capital letter 'T': a black and white drawing of a decorative fancy letter, arabesque/scroll,
        quadratura, paper cut-outs, art nouveau, precisionist lines and detail-oriented, quadratura, sabattier filter, bold lettering, high resolution
    Capital letter T, initial, dropcap, Fraktur, yinit, blackletter, monochrome, black and white,
        vector art, simplified outline
    
    A minimalist black-and-white dropcap letter 'D' intertwined with a stylized neural network pattern,
        encapsulating the theme of artificial intelligence.
    An elegant capital letter 'D' in black and white, with a subtle background of interconnected nodes and lines representing a machine learning model.
    "A sleek and modern dropcap letter 'D' with a digital circuit design,
        reflecting the concept of generative AI, in a monochrome palette."
    "The letter 'D' designed as if composed of tiny, pixelated bits, symbolizing digital data processing,
        in stark black and white contrast."
    "A dropcap letter 'D' where the inner spaces are filled with a binary code pattern, evoking the theme of computing and AI,
        in black and white."
    "A sleek dropcap letter 'D' with a shadow of binary code cascading down the page, symbolizing data flow in AI,
        all presented in a monochromatic scheme."
    "A capital letter 'D' designed with a fluid, organic network of neurons, capturing the dynamism of a neural network in a black-and-white color palette."
    "A bold dropcap letter 'D' merged with an abstract representation of a computer chip's intricate pathways,
        emphasizing the hardware aspect of AI, in grayscale tones."
    "A minimalist 'D' where the contours are made of a continuous line that loops and winds like an algorithm's path,
        depicted in high-contrast black and white."
    "The letter 'D' portrayed with a matrix of tiny, scattered pixels that seem to be self-assembling,
        reflecting the self-learning aspect of AI, executed in stark black-and-white."
      "A bold dropcap letter 'D' with a clear silhouette of a neural network, stylized with broad strokes for visibility at small sizes,
        in black and white."
    "A capital letter 'D' incorporating a simple, stylized digital circuit design, with visible lines and nodes for clarity when scaled down,
        in monochrome."
    "The letter 'D' with a prominent binary code pattern inside its form, designed with contrasting black and white areas for legibility at 150x150px."
    "A minimalist 'D' designed with a single,
        thick winding line that suggests an algorithm's path, in a high-contrast black-and-white style suitable for small dimensions."
    "A dropcap 'D' in a chunky pixel art style, resembling the building blocks of digital imagery,
        easily discernible when resized to a small scale, in grayscale."
    A minimalist 'D' designed with a single, thick winding line that suggests an algorithm's path,
        in a high-contrast black-and-white style suitable for small dimensions. The letter 'D' should be clearly visible and the winding line should be thick enough to be discernible even when scaled down. The overall design should emphasize simplicity and clarity, with strong contrast between black and white to ensure visibility at a small scale.
    A minimalist capital letter 'I' with a motif that mimics a vertical data stream, represented in high-contrast black-and-white suitable for small dimensions.
    A minimalist capital letter 'H' featuring a design that resembles a digital bridge structure,
        in high-contrast black-and-white suitable for small dimensions.
    A minimalist capital letter 'G' with an abstract design of a simplified chip-like pattern, in high-contrast black-and-white suitable for small dimensions.
    A minimalist capital letter 'F' with a design inspired by circuit board traces,
        bold and readable, in high-contrast black-and-white suitable for small dimensions.
    A minimalist capital letter 'E' crafted with bold, digital block patterns, suggestive of pixelation,
        in high-contrast black-and-white suitable for small dimensions.
    A minimalist capital letter 'C' with a motif of stylized digital waveforms, representing data transmission,
        in high-contrast black-and-white suitable for small dimensions.
    A minimalist capital letter 'B' with a design featuring clean lines and geometric shapes that imply a computational theme,
        in a high-contrast black-and-white style suitable for small dimensions.
    A minimalist capital letter 'A' designed with a thick, abstract line suggesting a digital flow,
        in high-contrast black-and-white style suitable for small dimensions.
    A minimalist capital letter 'D' designed with a single, thick winding line that suggests an algorithm's path,
        in a high-contrast black-and-white style suitable for small dimensions.

  • Curated light-mode samples (by style):

    

    

    

• Dark-mode:

  • Midjourneyv5 prompts:

    large capital letter C in blackletter, monochrome, artificial intelligence, neural network,
        deep learning, perceptron, clean, abstract, German, linocut, vector, outline, machine clockwork simplistic vector art, comic book cover, typography, dave gibbons, robotic expressionism, mid-century illustration, bold use of line, autopunk, steampunk --no intricate, complex, detailed, color, inverted, negated
    Capital letter C in simple fraktur blackletter, vintage, Art Deco style, monochrome, linocut,
        vector
    the letter C on the old black and white illustration, in the style of futurist dynamism, Victorian-inspired illustrations,
        dark indigo and light beige, i can't believe how beautiful this is, poster art, woodcut, science fiction influences
    Capital letter 'C': a black and white drawing of a letter, high contrast, arabesque/scroll,
        striking simple design, art deco 1969, precisionist lines and detail-oriented, quadratura, bold lettering, linocut
    vintage ornate letter C, text or wedding design vector illustration, in the style of highly detailed foliage,
        light black and light beige, writer academia, graphic illustration, revived historic art forms, high-angle, lettering mastery
    Capital letter 'C': a black and white drawing of a decorative fancy ornamental letter, simple designs,
        swirling vortex, calligraphic arabesque/scroll, quadratura, art nouveau (1860–1969), precisionist lines and detail-oriented, quadratura, sabattier filter, bold lettering, low resolution, simplified
    Capital letter C, initial dropcap, white on black, dark-mode, artificial intelligence, neural network,
    deep learning, brain, German, Gothic, monochrome, linocut Capital letter C, initial dropcap, white on black,
        machine, moon

  • Curated dark-mode samples (by style):

    

    

    

    

Holiday Themes

Gwern.net (like all the best Web 1.0 websites) supports time-limited holiday themes like Christmas & Halloween modes. For these modes, in addition to some CSS styling changes, we changes the website logo to a more festive ‘G’ logo (CC-0 licensed).

These logos were generated by uploading a PNG of the site logo to Midjourneyv5 & modifying it with a prompt. They were then processed like the dropcats and the holiday JS replaces the original logo as appropriate.

Christmas

6 light, 5 dark (considered samples: dark 1, 2; light 1, 2, 3)

Halloween

Just 1 dark, because Halloween mode forcibly turns on dark-mode, and we didn’t like most of the dark logos and didn’t feel we needed more than one, because this one was so cool:

Cheshire

Cheshire is used on ‘literary’ pages, like my Batman short story (2023-11-05: 42 uses).

Goudy Initialen

Goudy is used with more contemporary literary (eg. _Vectors 3.0) or (if they are not too technical) biological pages (the invention of breeding); whether a page gets Cheshire or Goudy right now mostly depends on how overused I feel Goudy has become, and more dropcaps would be useful to make more principled distinctions here (2023-11-05: 59 uses).

Blackletter

Deutsche Zierschrift

It appears to be an early 2000s digitization by Dieter Steffmann of a 1921 Rudolf Koch original.

Deutsche Zierschrift is the ‘default’ dropcap (2023-11-05: 180 uses), and is used on pages which don’t clearly fit into one of the more specific dropcaps; aside from newsletters (eg. May 2021), it covers topics like economics (“Ordinary Life Improvements”), psychology (impossibility of retrocognitive knowledge), or Wikipedia.

Kanzlei

Kanzlei is used on pages which are not so technical as to merit a yinit dropcap, for example, discussion of subscript typography or surprisingly Turing-complete technologies (2023-11-05: 99 uses).

Yinit

Yinit was developed for T_eX use by Yannis Haralambous in 1990 based on historical models, and we’ve borrowed it for web use.

yinit, befitting its elegant but severe look, is reserved for the most technical/statistical articles, like my dog cloning analysis or “The Kelly Coin-Flip Game” page (2023-11-05: 99 uses).