Here's a really cool text effect I made on @codepen: individual letter rotation + extrusion https://codepen.io/thebabydino/pen/WNqvdmN
No text duplication, no splitting the text into individual letters, no funky fonts.
#svgFilter #textEffect #coding #frontend #web #dev #webDev #webDevelopment #code #3D #extrude #extrusion #longShadow
A #contenteditable #3D text effect on @codepen https://codepen.io/thebabydino/pen/PogJybr
No text duplication, no images save for CSS gradients, no part of the effect baked into the font, no JS. It's all clever #CSS and #SVG #filter magic! 🪄✨
PS re: "trashed panda" 🦝🍾🥂🤪
https://www.bbc.com/news/articles/c5y2271q20lo
#svgFilter #cssGradient #code #coding #cssPattern #extrude #extrusion #frontend #web #dev #webDev #webDevelopment #textEffect #textEffects
Retro 3D 🍫🦋 effect on @codepen: https://codepen.io/thebabydino/pen/bGybXVj
No text duplication whatsoever, no long shadow list, no funky fonts, no JS, no images other than CSS gradients. Extrusion is all #SVG #filter magic 🪄✨ - as illustrated by the recording below including the DevTools panel.
#svgFilter #textEffects #textEffect #extrude #extrusion #code #coding #frontend #CSS #web #dev #webDev #webDevelopment #cssGradient
After ensuring that the object in https://pixelfed.social/p/Splines/795271266191779399 is #airtight, extrude the front and rear planar surfaces by 1 part (8 units) on each end. At the end of this step, you should have a solid #scroll object with a smooth surface except for the flat parts that will butt against the head of the unadorned #capital. We have now concluded the #tectonic portions of the entire #IonicOrder. All that remains are decorative #eggsAndDarts that go on the #ovolo of the capital and the #3StrandBraid that goes on the scroll.
#EggsAndDarts continuation of https://pixelfed.social/p/Splines/796958366767133979 Successive egg slabs are 1/2 part or 4 units away from each other. So the thinnest part of the dart is 4 units. The tip of the dart is at point P, which is 22 units from the major axis for the egg slab. The inside egg is 4 parts or 32 units wide, and we will start with the dart fin also at 32 units wide, even though a portion of the fin will be sliced off when the egg is sliced by the red cutting plane. To find the start and end of the fin, draw a vertical line from P of length µ/2 or 72 units. Offset that line on both sides by 16 units. Mark the intersections of these lines with the outline of the largest ellipse with points A and B. Draw an oval centered on AB with major radius 16 units and minor radius 2/5 of that, or 6.4 units. Divide each arc of the oval into 5 equal parts and mark AD and EF at 2/5 of that. Copy the oval from its top point C to D as well as E. Mark the intersection of the copies at F. Trim the 3 ovals to get 4 arcs AD, DF, FE, and EB. Join them and close the curve with a straight line from A to B. Draw a square 12 x 12 whose bottom edge is centered on P. From each of the top 2 corners, draw a circle with diameter 4 units, shown by RS. #Reflect point P using the major egg axis as a #mirror to get point Q. Draw a #circleThrough3Points P, Q, and R. The origin of the circle, point O should be 3.5 units directly below the base of the large oval. Draw a vertical line up from S to where it is tangent to the side of the large oval. Trim the straight line and arcs to get the left profile of the dart starting with A, passing through S and T, and ending at P. Join all 4 segments and reflect them using the line PC as the mirror. These mirrored copies are the #rails along which we will sweep the fin of the dart with #sweepTwoRails operation to create the dart, but we must orient the fin to be perpendicular to the rails first
Ana Tudor 🐯
Timo Höyssä
Splines