css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
user profile image

A magic trick developed using HTML and CSS only... and not a single line of JavaScript! The great magician Al will guess your card using his mental powers.

This magic trick/joke is a CSS only variation of a funny Garfield magic trick that I saw online a few years back (I found a video of it and even have the cards in the same order to play a hommage, aka copied it shamelessly).

No images or JavaScript code were harmed in the making of this CSS magic trick... because none were used :P


  1. This is such a clever trick! Took me a long time to figure it out.

  2. God I was FUMING for like 4 minutes, I thought there was some like eye-tracking JS hidden in the imports until I realized i had just been made a FOOL of

  3. Nice idea! I took about 2 minutes to figure out... very clever to trick somebody like this ;)

  4. Dumbest 'trick'.

  5. Fantastic! Clever idea, I got fooled. Nice "trick" :-)

  6. At first I thought this Alvaro guy was using Java or something to view my eye movements, but then I was like "hey! there's no webcam on my PC, and he can't be online 24/7!", and then I found out that NONE of the cards in the first group of 6, were present in the second group of 5; so whatever card you chose (even all of them), they wouldn't be present in the final group of cards! ☺

  7. Cool stuff... Good tricky work.....:)

  8. Clever! You fooled me twice before I figured it out :)

  9. After 1 game, i know what the trick is already 'cause i have watch a youtube video on it

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.