Logo/Icon #260
Replies: 10 comments 25 replies
-
|
I opened up the issues list to create this exact issue and this was a the top. :) Here are some straw men. I'm not very good at this.
|
Beta Was this translation helpful? Give feedback.
-
|
Google image search for "CF Logo" has a bunch of ideas.
|
Beta Was this translation helpful? Give feedback.
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
With Menlo font
|
Beta Was this translation helpful? Give feedback.
-
|
Roboto Mono (no licensing issues)
|
Beta Was this translation helpful? Give feedback.
-
Logo Design Questionnaire:
|
Beta Was this translation helpful? Give feedback.
-
|
LOL whoops https://github.com/OpenAPITools |
Beta Was this translation helpful? Give feedback.
-
|
Hoping to get to this soon. 😀 |
Beta Was this translation helpful? Give feedback.
-
|
Thank you for filling this out. |
Beta Was this translation helpful? Give feedback.
-
|
No no no thank you!!! |
Beta Was this translation helpful? Give feedback.
-
|
I have a few rough sketches to show you tomorrow if you have some time. Just let me know. |
Beta Was this translation helpful? Give feedback.
-
Note that these aren't meant to be the symbol/bug. I'd use them as a starting point for a bigger logo.
|
Beta Was this translation helpful? Give feedback.
-
|
gave DALL-E a go (don't mind the actual label) |
Beta Was this translation helpful? Give feedback.
-
|
Not bad. 😀 |
Beta Was this translation helpful? Give feedback.
-
|
@pmcelhaney I am hoping to spend some time on this soon. Do you have any preference for a starting point? |
Beta Was this translation helpful? Give feedback.
-
|
@tinydogio-joshua Sorry, just saw this. The black one speaks to me most. I want people to understand that Counterfact is the equivalent of paper prototypes or wireframes on the server side. People think it's duplicate work, but it's not. It's a tiny amount of work compared to building the real back end. It adds zero value to the shipped product and a ton of value to the process of building the product. |
Beta Was this translation helpful? Give feedback.
-
|
What do you think of something like this? It was suggested to add a few small details. I also thought adding some accent colors (which can be adjusted) would be nice. 
|
Beta Was this translation helpful? Give feedback.
-
|
I'll add a non "bug" version with text once I know this is ok. |
Beta Was this translation helpful? Give feedback.
-
|
Trying out some text treatments next to it. This is with Open Sans. 
|
Beta Was this translation helpful? Give feedback.
-
|
I like the background with the accent colors. Although it looks like an app icon (as in a GUI app, not a server). Looks good but I think it's the wrong direction. |
Beta Was this translation helpful? Give feedback.
-
|
ok. I will leave this here in case I ever need to come back to it. Shows it more in context of other graphics. 
|
Beta Was this translation helpful? Give feedback.
-
|
Thinking about the wordplay, I worked with ChatGPT and came up with this concept.
I like the playfulness of the wink. It says, yeah, I'm "working hard" to get all this stuff done. |
Beta Was this translation helpful? Give feedback.
-
|
That's supposed to be a coin, BTW.
|
Beta Was this translation helpful? Give feedback.
-
|
I'll try to make something more fun and less "app icon" like. I'm more of a UI designer, so my designs tend to be more aligned that way. I'm not much of an illustrator (which is what I'm getting from the above). I'll see what I can do, but they probably won't be as good as these. |
Beta Was this translation helpful? Give feedback.
-
|
This is how far I got today. I. need to take off. I will provide another update tomorrow with text treatments. 
|
Beta Was this translation helpful? Give feedback.
-
|
What's your favorite color @pmcelhaney ? In general... don't worry about the colors above. Thinking of switching it around a bit; or at least messing around with other colors. |
Beta Was this translation helpful? Give feedback.
-
|
#2f94e3 or thereabouts |
Beta Was this translation helpful? Give feedback.
-
|
I had ChatGPT write some marketing copy for me, then generate logos inspired by that marketing copy. I like the top left here.
|
Beta Was this translation helpful? Give feedback.
-
|
I'm polling a few more people. Will select a winner in a few hours. As of now bottom left is winning. |
Beta Was this translation helpful? Give feedback.
-
|
Created this SVG by hand. It needs to be tweaked a little bit. <svg width="300" height="300" xmlns="http://www.w3.org/2000/svg">
<polygon points="150,150 63.3974596216,300 236.602540378, 300 " fill="#0071b5" stroke="#0071b5"/>
<polygon points="150,150 236.602540378,300 300,150 " fill="#f58e00" stroke="#f58e00"/>
<polygon points="150,150 236.602540378,0 300,150 " fill="#0071b5" stroke="#0071b5"/>
<polygon points="150,150 236.602540378,0, 63.3974596216,0" fill="#0071b5" stroke="#0071b5"/>
<polygon points="150,150 0,150, 63.3974596216,0" fill="#0071b5" stroke="#0071b5"/>
<polygon points="150,150 0,150, 63.3974596216,300" fill="#0071b5" stroke="#0071b5"/>
</svg> |
Beta Was this translation helpful? Give feedback.
-
|
I like this. Simple and I like the slice of pie theme. Brings to mind that I'm swapping out a piece of the polygon. |
Beta Was this translation helpful? Give feedback.
-
|
Great! That's exactly what I was going for! |
Beta Was this translation helpful? Give feedback.
-
|
Here's a script to generate the hexagon. const xmlns = "http://www.w3.org/2000/svg";
const width = 200;
const height = 200;
const size = 50; // Adjusted size for better fit
const centerX = width / 2;
const centerY = height / 2;
const angle = Math.PI / 3; // 60 degrees in radians
const svg = document.createElementNS(xmlns, "svg");
svg.setAttributeNS(null, "width", width);
svg.setAttributeNS(null, "height", height);
svg.setAttributeNS(null, "viewBox", `0 0 ${width} ${height}`);
function createTriangle(x, y, rotation, offset = 6) {
const points = [[x, y]];
for (let i = 0; i < 2; i++) {
const theta = i * (2 * Math.PI / 6) + rotation; // Corrected divisor to 6
const px = x + size * Math.cos(theta);
const py = y + size * Math.sin(theta);
points.push([px, py]);
}
const offsetRotation = rotation + Math.PI / 6;
const offsetPoints = points.map(([xx, yy]) => [xx + Math.cos(offsetRotation) * offset , yy + Math.sin(offsetRotation) * offset]);
const polygon = document.createElementNS(xmlns, "polygon");
polygon.setAttributeNS(null, "points", offsetPoints.join(" "));
polygon.setAttributeNS(null, "fill", rotation === 0 ? "#f58e00" : "#0071b5");
svg.appendChild(polygon);
}
for (let i = 0; i < 6; i++) {
const rotation = i * angle;
createTriangle(centerX, centerY, rotation);
}
document.body.appendChild(svg); |
Beta Was this translation helpful? Give feedback.
-
|
Finally, an SVG file. It could still be improved by someone who has access to a good editor and knows how to use it.
|
Beta Was this translation helpful? Give feedback.
-
You need a logo/icon. 😀
Beta Was this translation helpful? Give feedback.
All reactions